2010-09-12 108 views
1

當您點擊該字段時,如何讓文字消失,並在您點擊時再次出現?如何使用CSS更改文本字段中初始文本的顏色?

+0

考慮將這些不同的問題。 – 2010-09-12 05:52:45

+0

注意:如果文本是默認文本,而不是用戶已經開始輸入的文本,則應該使文本消失! (如果用戶輸入前半部分然後再輸入其他字符,並在輸入文本中再次重新聚焦,或者用戶在提交輸入前重新校正錯字) – FelipeAls 2010-09-12 06:54:37

回答

1

CSS:

input.placeholder { 
    color:#ccc; 
} 

的JavaScript:

(function() { 
    var placeholders = document.getElementsByClassName('placeholder'); 
    for(var p = 0; p < placeholders.length; p++) { 
     var placeholder = placeholders[p]; 
     placeholder.onfocus = function() { 
      this.value = ''; 
      this.removeClass('placeholder'); 
     }; 
     placeholder.onblur = function() { 
      if(this.value == '') { 
      this.addClass('placeholder'); 
      } 
     } 
    } 
})(); 
1

你只是指你的第一個問題的顏色屬性?至於當你點擊字段時文本消失,你的意思是一個html輸入字段?

如果它只是一個div,那麼設置一個onmouseover和onmouseout事件來隱藏div(可能使用display:block和display:none)可以實現該功能。

+0

也就是說,顏色屬性又稱顏色文本。在你有value =「X」的輸入標籤中,我想改變X的顏色。是的,一個html輸入字段。 – 2010-09-12 05:37:46

2

color css屬性用於設置文本顏色 。您可以使用名稱值,rgb值或十六進制值。

改變元素對事件反應的可見性需要一些javascript知識。您可以使用jQuery,這是一個JavaScript庫,來實現這一點。通過toggling行爲,你可以使一個元素消失,然後重新出現。

如果您希望在文本框中使用默認文本之類的內容,直到用戶專注於此,則需要處理焦點和模糊事件。這posting有一個教程。

+0

我嘗試使用顏色CSS屬性。我似乎無法更改輸入標記的值=「X」內的文本X。我應該如何調整我的html代碼? – 2010-09-12 05:39:54

+0

@Justin,這裏有一個活的工作示例:http://jsfiddle.net/H3Tr3/ – 2010-09-12 05:43:29