Показать вспомогательный текст при щелчке текстового поля с помощью jquery

Я хочу отображать вспомогательный текст при нажатии на текстовые поля. например: Если я щелкну текстовое поле, оно должно помочь нам, сказав, что вводить: Введите имя пользователя здесь

Я пробовал приведенный ниже код, но текст «Введите имя пользователя» исчезает, я хочу, чтобы текст отображался до тех пор, пока фокус не будет изменен на другое текстовое поле.

пожалуйста, предложите какой-нибудь код для этого типа.

<input type = "text"/><span>Enter username</span>
<input type = "text"/><span>Enter password</span>     


$(document).ready(function(){
    $("input").focus(function () {
         $(this).next("span").css('display','inline').fadeOut(1000);
    });
});

focus setfocus jquery textbox
person Senthil Kumar Bhaskaran    schedule 30.07.2009    source источник

Ответы (2)


arrow_upward
4
arrow_downward

Что-то вроде следующего должно сделать это

$(function(){
    $("input")
        .focus(function () {
            $(this).next("span").fadeIn(1000);
        })
        .blur(function () {
             $(this).next("span").fadeOut(1000);
        }); 
});

Вот рабочая демонстрация

person Russ Cam    schedule 30.07.2009
comment
Вы можете отредактировать образец, добавив ‹b› / edit ‹/b› к URL-адресу. Вы можете улучшить его, убедившись, что вспомогательный текст для текстового поля исчезает после того, как вспомогательный текст для другого текстового поля закончил исчезать. Это было бы просто, используя классы CSS. - person Russ Cam; 30.07.2009
comment
который должен был выйти / отредактировать URL-адрес. Я думал, что разметка html теперь работает в комментариях, но похоже, что это не так. - person Russ Cam; 30.07.2009

arrow_upward
1
arrow_downward

Я не уверен, почему вы манипулируете свойством отображения CSS, а также используете fadeIn / fadeOut:

$(document).ready(function(){
    $("input").focus(function () {
         $(this).next("span").fadeIn(1000);
    }).blur(function() {
        $(this).next("span").fadeOut(1000);
    });
});
person karim79    schedule 30.07.2009