JavaScript中的Onclick屬性操縱？

Question

我有一個輸入字段，其中包含一些預定義的文本，說明其用途。 如果用戶單擊，則應該為空白，以便用戶可以自己編寫。 但是，如果用戶已經輸入自定義文本並且由於某種原因再次單擊該字段，則不會發生這種情況。

第一部分有效，第二部分無效。 我該如何調整此代碼？

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

Answer 1

您可能想要onfocus，請看以下示例：

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

如果當前關注的值的值為“名稱”，則將該值設置為none

如果模糊時的當前值沒有值，請將其設置為“名稱”

更好的方法是使自動清除功能正常運行，因此您不必每次都重新鍵入它：

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" >

調用這樣的函數將設置自動清除：

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

一個工作的jsFiddle

Answer 2

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

改用onfocus和onblur :)

Answer 3

如前所述，您應該在支持該功能的瀏覽器中使用html5占位符屬性。

<input type="text" id="name" />

<script>
function addPlaceHolder(elt, defaultText) {
    if("placeholder" in document.createElement("input"))
        elt.placeholder = defaultText;
    else 
    {
        var defaultValue = defaultText;
        elt.value = defaultText;
        elt.onfocus = function()
        {
            if(this.value === defaultValue)
            {
                this.value = '';
            }       
        }
        elt.onblur = function()
        {
            if(this.value === '')
            { 
                this.value = defaultValue;
            }
        }
    }
}
addPlaceHolder(document.getElementById('name'), 'defaultText');
</script>

Answer 4

您在將字符串“ true”和“ false”轉換為布爾值時遇到問題。

觀看這個小提琴 。 顯然在JS中：

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

Answer 5

好吧，我這樣做是這樣的：

firstclick='1' value="Antwort verfassen..." 
onfocus="if(this.getAttribute('firstclick')) {
    this.value='';this.removeAttribute('firstclick');
};"