Редактировать с помощью textarea -> как сохранить заполнитель? - PullRequest
0 голосов
/ 12 октября 2011

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

<div class="class" id="test">Test</div>

text = $('#test').text();
$('#test').replaceWith('<textarea onkeyup="update_textarea(this)" 
id="test"  placeholder="' + text + '" />');

Функция updateTextarea делает вновь вставленный текст доступным в качестве значения (что означает, что я могу использовать вставленный текст позже снова).

Теперь, чего мне не хватает или чего я хочу: когда я нажимаю на свой div со значением Test, он становится редактируемым (потому что это больше не div, это текстовая область).Проблема в том, что заполнитель правильный, но когда я щелкаю внутри текстовой области, чтобы вставить новый текст, заполнитель удаляется, текстовая область пуста.Как я мог предотвратить это, сохраняя заполнитель как значение в пределах текстовой области?

Должно быть что-то с onFocus, я думаю ... но как его сохранить.

Спасибо

Ответы [ 3 ]

1 голос
/ 12 октября 2011

Атрибут-заполнитель предназначен для исчезновения, когда пользователь вводит текст в input, поэтому он работает так, как задумано в этом случае.Я подозреваю, что вы хотите применить текст к элементу textarea;и для этого я бы предложил следующее:

$('#test').live('click',
    function(){
        $(this).replaceWith('<textarea>' + $(this).text() + '</textarea>');
    });

$('textarea').live('blur',
    function(){
        $(this).replaceWith('<div id="test" class="class">' + $(this).text() + '</div>');
    });

JS Fiddle demo .

Ссылки:

1 голос
/ 12 октября 2011

Проверьте это

    $("#test").live('click',function(){
    var text = $('#test').text();
    //var text = $('#test').html(); // use this for html tags also
        $('#test').replaceWith('<textarea id="test2">' + text + '</textarea>');
})
$("#test2").live('blur',function(){
        var text2 = $('#test2').val();
        $(this).replaceWith('<div id="test">' + text2 + '</div>');
});
    <div id="test">Test</div>

Регистрация в jsFiddle

http://jsfiddle.net/VbSV5/
1 голос
/ 12 октября 2011

Может быть, это поможет вам. Добавьте это после $('#test').replace...

$('#test').one('focus',function(){
       $(this).text(text)
    })

проверьте здесь http://jsfiddle.net/a8AA5/

...