Использование .live / .bind в jQuery для воздействия на ввод, созданный циклом for

Question

У меня есть два массива, один с именами входов и один со значением для каждого ввода. Имеется 7 входов, поэтому я сделал цикл для заполнения каждого ввода его значением, затем сделал так, чтобы текст исчезал при фокусировке этого ввода, и восстанавливал текст исходного значения, если ничего не было напечатано. Это возможно сделать через цикл с jQuery? Мне кажется .live и .bind не будут работать для этой цели. Придется ли мне делать хардкор в каждом событии ввода: фокус и размытие?

for (var i=0;i<7;i++) {

    $('#user_' + input_names[i]).attr('value', default_values[i]);

    $('#user_' + input_names[i]).live("blur", function(){
        if(this.value == '')this.value=default_values[i];
    });

    $('#user_' + input_names[i]).live("focus", function(){
        if(this.value == default_values[i])this.value='';
    });

}

---

Обновите здесь, освободив массивы, как просил Эрик:

var input_names = ['username', 'password'];
var default_values = ['Username', 'Password'];

for (var i=0;i<2;i++) {    
    $('#user_' + input_names[i]).attr('value', default_values[i]);

    $('#user_' + input_names[i]).blur(function(){
        if(this.value == '')this.value=default_values[i];
    });

    $('#user_' + input_names[i]).focus(function(){
        if(this.value == default_values[i])this.value='';
    });
}

Answer 1

Похоже, вы ищете атрибут HTML5 placeholder. Просто измените свой HTML на это:

<input id="user_username" placeholder="Username" />
<input id="user_password" placeholder="Password" />

Если вам нужна обратная совместимость, для этого есть плагин jQuery . Используя плагин, просто сделайте это:

$('input[placeholder]').placeholder();

---

Что касается того, что не так с вашим исходным кодом, я подозреваю, что есть проблема с закрытием, и i сохраняет значение 7. Вы бы лучше переписали его так:

var inputDefaults = {username: 'Username', password: 'Password'};

$.each(inputDefaults, function(field, defaultValue) {
    $('#user_' + field)
        .attr('value', defaultValue);
        .blur(function() {
            if($(this).val() == '')
                $(this).val(defaultValue);
        })
        .focus(function(){
            if($(this).val() == defaultValue)
                $(this).val('');
        });
});