在javascript中进行Onclick属性操作？

Question

我有一个输入域，有一些预定义的文本，解释它的用途。如果用户点击，它应该是空白的，这样用户就可以写他/她自己的。但是，如果用户已经输入了自定义文本，并且出于某种原因再次单击该字段，则不应该发生这种情况。

第一部分可以工作，第二部分不能工作。我需要如何调整这段代码？

 <input type="text" value="Write something..." firstclick=true
 onclick="if(this.getAttribute('firstclick')) {
 this.value='';this.setAttribute('firstclick',false);} ;"/>

Answer 1

您在将字符串"true“和"false”转换为bool时遇到了问题。

看this fiddle吧。显然在JS中：

Boolean("false");  // == true
!! "false";        // == true

Answer 2

您可能希望使用onfocus，请看下面的示例：

<input type="text" value="Name"
    onfocus="if(this.value === 'Name'){this.value = ''}" 
    onblur="if(this.value === ''){ this.value = 'Name'}" >

如果焦点上的当前值具有值"Name"，则将该值设置为nothing

如果模糊的当前值没有值，则将其设置为"Name“

一个更好的方法是让autoclear成为一个函数，这样你就不必每次都重新输入它：

function autoClearField(domElement)
{
    var defaultValue = domElement.value;
    domElement.onfocus = function()
    {
        if(this.value === defaultValue)
        {
            this.value = '';
        }
    }

    domElement.onblur = function()
    {
        if(this.value === '')
        { 
            this.value = defaultValue;
        }
    }
}

对于HTML，您可以使用：

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

像这样调用函数来设置autoclear：

autoClearField(document.getElementById('name'));

A working jsFiddle

Answer 3

<input type="text" value="Write something..." 
onfocus="if(this.value=='Write something...'){ this.value='';}" 
onblur="if(this.value==''){this.value='Write something...';}">

改用onfocus和onblur :)