的jQuery的.html（）。长度不返回正确的值

我想 1）删除默认的文本在一个文本，当用户专注于它。 2）如果他没有输入任何东西并点击，则应该重新插入默认文本。的jQuery的.html（）。长度不返回正确的值

我的代码如下处理案例＃1，但在Chrome和Safari（但不是Firefox）中案例＃2失败。当我输入文本（所以$（this）.html（）。length> 0），然后点击，jQuery不正确地确定$（this）.html（）。length == 0，所以它删除输入的文本并重新插入默认文本。

jQuery(document).ready(function inputHide(){ 
    $('textarea').each(function(){ 
     var this_area = $(this); 
     var this_area_val; 

     this_area_val = this_area.html(); 
     this_area.focus(function(){ 
      if(this_area.html() == this_area_val){ 
        this_area.html(''); 
      } 
     }).blur(function(){ 
      if(this_area.html().length == 0){ 
       this_area.html(this_area_val); 
      } 
     }); 
    });

感谢您的帮助。

来源

2010-10-07 JMan

SLaks是正确的。原因如下：html()/innerHTML为您提供HTML文档中textarea的文本节点内容。当您更改textrea中的文本时，此内容不会更改。 value="..."属性在<input>和checked或selected属性对checked/selected属性也是如此。

两者的HTML文档内容都反映了表单字段的默认值，而不是当前值。当前值反映在属性中，名为value，其中在jQuery中使用val()来读取。设置value属性更新字段的当前值;设置value属性或textarea的HTML内容仅更改字段的默认值，而不更改其当前值。

...除了在某些浏览器设置为默认值设定的电流值，以及，或在有限的情况下可以做的，这导致了浏览器的不一致性。另外IE在这方面有一些众所周知的错误，导致混淆行为。最好避免设置默认值并且很少需要;你几乎总是想要设置当前值。

该字段的默认值存储在属性defaultValue中，所以实际上不需要您明确记住每个textarea的默认值。（而且你不应该这样做，因为页面加载时的表单字段的值是，不一定是，它与HTML中的默认值相同。如果您更改值，浏览页面，然后点击后退按钮时，表单值被记住，初始值是不是您所期望的默认值）

所以，你的代码可以简化为：

$('textarea').focus(function() { 
    if (this.value===this.defaultValue) 
     this.value= ''; 
}).blur(function() { 
    if (this.value==='') 
     this.value= this.defaultValue; 
});

（OK，你可以写$(this).val()===$(this).attr('defaultValue')的比较，如果你真的想让它无偿jQuery的等等。我不能打扰，平原DOM版本更易于阅读。）

来源

2010-10-07 15:59:12 bobince

天才。我不知道'defaultValue'属性，但是这允许我将'textarea，input：text，input：password'个案组合成一个jQuery语句。光滑！ – JMan 2010-10-07 19:24:02

要获取或设置输入元素的内容，请调用.val() method。请拨.html()。

来源

2010-10-07 15:30:21 SLaks

获取**和**设置。 – 2010-10-07 15:36:43

你想要做的是称为输入字段占位符。有一个whole bunch of JQuery plug-ins已经可以做到这一点。这也是built into the HTML5 standard，这意味着大多数最新的浏览器现在只需将placeholder属性添加到您的输入或textarea标记即可。

如果你还想开发自己的，我建议不实际添加提示到textarea;而是有一个跨度包含你在textarea顶部显示的提示文本。然后，您需要做的就是在适当的时候hide() it和show()。比试图改变字段的文本内容更容易。

来源

2010-10-07 15:57:14 Spudley

的jQuery的.html（）。长度不返回正确的值

回答

相关问题