2009-09-16 4 views
1

вот простой (с которым я борюсь)! У меня есть текстовое поле, кнопка и пустой div. Все, что я хочу сделать, это вставить обновленное содержимое текстового поля в div onClick кнопки. Вот что у меня до сих пор:Получите обновленное значение из текстового поля и вставьте его в div с jQuery?

<html> 
<head> 
    <script type="text/javascript" src="jquery.js"></script> 
    <script type="text/javascript"> 
    function get_text() { 
    $("#preview").replaceWith($("#editor").val()); 
    } 
    </script> 
</head> 
<body> 
    <form> 
    <textarea name="editor" id="editor">GrumbleCakes</textarea> 
    <input type="button" value="Preview" onclick="get_text();" /> 
    </form> 
    <div id="preview"></div> 
</body> 
</html> 

Он работает в первый раз, когда вы щелкните на кнопке ... со значением, которое было в текстовое поле на странице загрузки («GrumbleCakes»), но это все. Он не будет работать с обновленным текстом.

+0

+1 для GrumbleCakes. – womp

+0

Видимо, для этого есть несколько разных способов ... благодаря всем за вашу помощь! – Sam

ответ

3

Вы можете установить содержание innerHTML или текст просматриваемого DIV с помощью html или text функции:

$("#preview").html($("#editor").val()); 
+0

действительно. replaceWith заменяет сам

and
. Поэтому после первого щелчка заменить нечего. – Eimantas

+0

Идеально! Благодаря! – Sam

2

.replaceWith фактически заменяет элемент DOM. Таким образом, div удаляется и заменяется текстом. Последующие вызовы функции больше не найдут div, так как они были удалены.

Я думаю, что вы хотите использовать

.html($("#editor").val()).

2

Оба

$('#preview").html($("#editor").val())

и

$("#preview").text($("#editor").val())

должен работать.

Однако .html позволит любому вводить HTML или JavaScript в вашем сайте, оставив его широко открыты для атак межсайтового скриптинга ...

0

Jikes !!

мужчина, которого вы заменяете div с содержимым текстового поля. используйте эту функцию вместо:

function get_text(){ 
    var t=$("editor").val(); 
    $("#preview").text(t); 
} 
Смежные вопросы