的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（）。長度不返回正確的值

回答

相關問題