Текст Jquery Blur и пустой на Focus

Question

У меня есть несколько текстовых полей, подобных этому. Я хочу, чтобы текст был размытым и пустым, когда он фокусировался. Я могу добиться этого для одного текстового поля. Как я могу передать текущий идентификатор элемента вместо жесткого кодирования значения «#name» в функции JavaScript?

$(document).ready(function(){ 


    $('#Name').focus(function() 
    { 
     var $ele = $(this).attr('id'); 
      $(this).val(''); 
      $(this).css('color', '#000000'); 
    }); 

    $('#Name').blur(function() 
    { 
      var $ele = $(this).attr('id'); 
      $(this).val($ele); 
      $(this).css('color', '#a9a9a9') 
    }); 
}); 



<input id="Name" type="text" value="" name="Name"> 
<input id="Phone" type="text" value="" name="Phone" > 
<input id="Email" type="text" value="" name="Email"> 

Answer 1

Вы можете выбрать все входные данные $('input'), и вы можете вставлять текстовые входы фильтра, используя [type="text"]; Вы можете воспользоваться преимуществами цепочки jQuery.

$(document).ready(function(){ 

    $('input[type="text"]').focus(function() 
    { 
     var $ele = $(this).attr('id'); 
      $(this).val(''); 
      $(this).css('color', '#000000'); 
    }).blur(function() 
    { 
      var $ele = $(this).attr('id'); 
      $(this).val($ele); 
      $(this).css('color', '#a9a9a9') 
    }); 
}); 

Вы можете непосредственно установить значение поля ввода в HTML

<input id="Name" type="text" value="Name" name="Name"> 

или применить значения по умолчанию на странице загрузки, как:

$('input[type="text"]').each(function(){ 
    var $ele = $(this).attr('id'); 
       $(this).val($ele); 
       $(this).css('color', '#a9a9a9') 

}); 

HTML

<input id="Name" type="text" value="" name="Name"> 
<input id="Phone" type="text" value="" name="Phone" > 
<input id="Email" type="text" value="" name="Email"> 

Answer 2

применить его к input вместо #name.

это будет работать для всех входов.

или укажите .class элементам, которые вы хотите изменить.

Answer 3

Вы можете выбрать все входы с $('input[type="text"]'), но я думаю, вы просто хотите использовать placeholder HTML attribute.

Answer 4

Смотри в jQuery Selectors. Теперь вы используете идентификатор в качестве селектора. У вас есть множество различных опций ...

Вы можете заменить «#Name» на «input», если вы хотите, чтобы оно применимо ко всем входам на странице, или вы даже можете добавить тест класса class = class «» всем элементам, которые вы хотите запустить сценарий, а затем заменить «#Name» на «.test» или «input.test» только для входных элементов с этим именем класса.

Answer 5

Вам нужно изменить вам Js

$(function(){ 
    $('input').focus(function() 
    { 
     $(this) 
      .val($(this).attr('name')) 
      .css('color', '#000000') 

    }).blur(function() 
    { 
      $(this).css('color', '#a9a9a9') 
    }); 
})();​ 

если вы установите значение на «размытость» вы потеряли текущее значение ... Я не уверен, что это именно то, что вы хотите