Question

我正在努力 1）当用户关注文本区域时，删除文本区域中的默认文本。 2）如果他没有输入任何内容并点击，则应重新插入默认文本。

下面的代码处理案例＃1，但Chrome和Safari（但不是Firefox）中的案例＃2失败了。当我输入文本（所以$（this）.html（）。length＆gt; 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);
            }
        }); 
    });

感谢您的帮助。

Answer 1

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

请勿致电.html()。

Answer 2

SLaks是对的。原因如下：html() / innerHTML为您提供HTML文档中textarea的文本节点内容。更改textrea中的文本时，此内容不会更改。 value="..."上的<input> 属性以及checked或selected属性与checked / {{ 1}}属性。

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

...除了在某些浏览器上设置默认值也设置当前值，或者可能在有限的情况下，这会导致浏览器不一致。此外，IE在该领域存在许多众所周知的错误，导致行为混乱。最好避免设置默认值，很少需要;你几乎总想设置当前值。

字段的默认值存储在属性value中，因此实际上您无需尝试明确记住每个textarea的默认值。（并且您不应该这样做，因为页面加载时表单字段的值不一定与HTML中的默认值相同。如果更改值，请导航页面然后点击后退按钮，会记住表单值，初始值不是您预期的默认值。）

因此您的代码可以简化为：

defaultValue

（好吧，你可以写$('textarea').focus(function() { if (this.value===this.defaultValue) this.value= ''; }).blur(function() { if (this.value==='') this.value= this.defaultValue; });进行比较，如果你真的想让它像jQuery一样无趣。我不能打扰，普通的DOM版本更容易阅读。）

Answer 3

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

如果您仍想开发自己的，我建议不要将提示添加到textarea;而是有一个包含您显示在textarea顶部的提示文本的范围。然后，您需要做的就是hide()它和show()在适当的时刻。比试图改变该领域的文本内容更容易。

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

3 个答案: