Как изменить текст формы с помощью Jquery, но сохранить его при заполнении пользователем?

Question

(Надеюсь, мой заголовок понятен, подвести его было сложно.)

У меня есть скрипт, который меняет текст внутри формы в зависимости от выбранной радиокнопки, как вы можете видеть здесь: http://jsbin.com/onowu/

Проблема в том, что если какой-либо пользователь введет какой-то текст, а затем нажмет другую кнопку-переключатель, он удалит его текст.

То, что я ищу, - это способ изменить серый текст ТОЛЬКО в том случае, если текст не заполнен пользователем. И если пользователь удалит свой текст, он заполнится пустым текстом в зависимости от выбранной радиокнопки.

Вы можете увидеть мой код здесь: http://jsbin.com/onowu/edit

Answer 1

Проверьте, имеет ли вход класс «подсказка». Измените только текст.

Полный пример:

$(document).ready(function() {
    function setText(){
        var kf = this.title.split('|');
        if (kf.length < 0) return;
        if($('#' + this.name + '_text').hasClass('hint')){
            $('#' + this.name + '_text').val(kf[0]).addClass('hint');
        }
        $('#' + this.name + '_text').attr('title', kf[0]);
    }

    $("input[type='text']").inputdynvalue();
    $("input[type='radio']").click(setText);
});

Это работает путем проверки входного текстового поля для класса «подсказка» и изменения значения только тогда, когда оно найдено. Как упоминалось в комментариях Джонатана Сэмпсона"событие .focus () удаляет класс" подсказка ", а событие .blur () добавляет его снова, если текст не был предоставлен".

Я бы также запустил ваш код через службу проверки html , предоставляемую W3C. JavaScript может быть забавным, если у вас нет действующего кода. (Плюс каждый должен написать правильный HTML)

А также заметил, что вы дважды включали в свой код jQuery, я бы посоветовал вам удалить один из них.

---

Обновлено (10 июля 2009 г.): исправлена ​​ошибка, упомянутая в комментариях ниже.