输入值不会马上改变jquery

-1

我创建了一个jQuery占位符，它的作用类似于浏览器的chrome/firefox默认占位符，但不支持，但我无法获得placholder div的html更改速度一样快Chrome/Firefox的默认占位符如何更改。它只会在我放开键时发生变化，或者如果您按下某个键时它只会在输入中至少有2个字符时才会更改。我怎样才能解决这个问题？输入值不会马上改变jquery

http://jsfiddle.net/HW7tK/2/

<html> 
    <head> 
     <title>Place Holder</title> 
     <style media="screen" type="text/css"> 
     input{ 
      position:absolute; 
      top:4px; 
      left:4px; 
      background:transparent; 
     } 
     #default{ 
      top:30px; 
     } 
     #ph{ 
      color:LightGray; 
     } 
     </style> 
     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
     <script type="text/javascript"> 
     window.onload = function() { 
      $("#txt") 
       .keypress(function(){ 
        if($('#txt').val().length > 0){ 
         $('#ph').html(''); 
        } else { 
         $('#ph').html('Custom Place Holder'); 
        } 
       }) 
       .keyup(function() { 
        if($('#txt').val().length > 0){ 
         $('#ph').html(''); 
        } else { 
         $('#ph').html('Custom Place Holder'); 
        } 
       }); 
     } 
     </script> 
    </head> 
    <body> 
     <div id="ph">Custom Place Holder</div> 
     <input id="txt" type="text" /> 
     <input id="default" type="text" placeholder="Default Placeholder"/> 
    </body> 
</html>

来源

2013-11-04 Eddie Castle

我使用定时器（setTimeout）解决了这个问题，但我不知道在这种情况下使用定时器是否是好的做法。 http://jsfiddle.net/HW7tK/10/ –

林不知道，如果它使是太大的区别，但我做了小改动，以代替keypress使用和视觉上看起来与默认的行为很没有区别：

http://jsfiddle.net/HW7tK/4/

来源

2013-11-04 11:23:32 Jamiec

我只是做了同样的事情，虽然 –

试试这个。

而不是追加HTML，尝试隐藏div。它可以满足你的满意

if($('#txt').val().length > 0){ 
        $('#ph').hide(); 
       } else { 
        $('#ph').show(); 
       }

if($('#txt').val().length > 0){ 
        $('#ph').hide(); 
       } else { 
        $('#ph').show(); 
       }

来源

2013-11-04 11:24:10

它没有看到有什么区别它仍然有同样的问题。这不是一个大问题，但它一直在窃听我，我自己也无法修复它。 –

输入值不会马上改变jquery

回答

相关问题