頁面加載時的Javascript字數不是keyup

我有一點點javascript可以計算一個盒子上的字數。的JavaScript看起來像這樣：頁面加載時的Javascript字數不是keyup

<script type="text/javascript"> 
    function cnt(w,x){ 
     var y=w.value; 
     var r = 0; 
     a=y.replace(/\s/g,' '); 
     a=a.split(' '); 

     for (z=0; z<a.length; z++) {if (a[z].length > 0) r++;} 
     x.value=r; 
     if (r > 60) { 
      x.value='Please reduce the word count'; 
     } 
    } 
</script>

和像這樣的形式：

<label>Free brochure from entry:</label> 
<textarea name="freebrochureentryform" id="freebrochureentryform" onKeyUp="cnt(this,document.brochure.c)"><?php echo $row['freebrochureentryform']; ?></textarea> 

<label>Brocure Entry Word Count:</label> 
<input type="text" name="c" value="0" size="20" onKeyUp="cnt(document.brochure.freebrochureentryform,this)" />

基本上底部輸入字段顯示的單詞中的一個上的量。但是，只有當你點擊上面的框「freebrochureentryform」時，它纔會這樣做，但是我希望它在頁面加載後立即加載單詞量，而不是單擊該框時。我想這是與

onKeyUp="cnt(document.brochure.freebrochureentryform,this)"

但不知道該怎麼改變它。

（順便說一句方法手冊是我的表單的名稱。）

任何幫助極大的讚賞。

伊恩

來源

2013-07-16 snookian

您可以致電window.onload事件cnt()功能。和

，而不是聽onkeyup事件，你可以聆聽到更合適的oninput（或onpropertychange用於IE）事件：

JSFiddle

<label>Free brochure from entry:</label> 
<textarea name="freebrochureentryform" id="freebrochureentryform">Lorem Text</textarea> 
<br /> 
<label>Brocure Entry Word Count:</label> 
<input type="text" name="c" id="c" value="0" size="20" />

window.onload=function(){ 
    function cnt(area,output){ 
     var txt=area.value.replace(/^\s+|\s+$/g,"").replace(/\s+/g," ").split(" "); 
     if(txt.length>10){ 
      output.value="Please delete some word"; 
     }else{ 
      output.value=txt.length; 
     } 
    } 
    var textarea=document.getElementById("freebrochureentryform"); 
    var info=document.getElementById("c"); 
    if("addEventListener" in window){ 
     if("oninput" in textarea){ 
      textarea.addEventListener("input",function(){ 
       cnt(textarea,info); 
      },false); 
     }else if("onpropertychange" in textarea){ 
      textarea.addEventListener("propertychange",function(e){ 
       if((e||event).propertyName=="value"){ 
        cnt(textarea,info); 
       } 
      },false); 
     }else{ 
      textarea.addEventListener("change",function(){ 
       cnt(textarea,info); 
      },false); 
     } 
    }else{ 
     textarea.attachEvent("onpropertychange",function(){ 
      if(event.propertyName=="value"){ 
       cnt(textarea,info); 
      } 
     }); 
    } 
    cnt(textarea,info); 
};

一些指令：

var txt=area.value
- .replace(/^\s+|\s+$/g,"")表示爲trim;
- .replace(/\s+/g," ")將一系列的空白（包括換行符）合併爲一個（更好的split而不需要迭代拆分的數組）。
- .split(" ")按空格分開（如您已經完成的那樣）。
oninput引入IE9但has some buggy behavior，所以你可能要先嚐試onproperychange;
把function cnt()和textarea/info在window.onload使他們在closure「安全」。它們不能污染全局名稱空間，全局名稱空間中的東西不能污染它們。

來源

2013-07-16 11:42:19 Passerby

這對頁面加載很有效，但我應該提一提，我也希望它在盒子上鍵入時更新，所以當你輸入時顯示到目前爲止輸入了多少個單詞。 – snookian

@snookian這就是'oninput' /'onpropertychange'事件監聽器的功能。打字時你有什麼問題嗎？我測試好了。 – Passerby

onKeyUp只在用戶交互觸發。

如果加載側面沒有事件KeyUp

所以不是。手動觸發它。

你的身體上的呼叫cnt(document.brochure.freebrochureentryform,document.brochure.c)手動（或onload）

來源

2013-07-16 10:57:24 Eun

但是，sur in在不知道什麼「，這個」是從身體標記？ – snookian

耶對不起，只是把'this'改成你的輸出'document.brochure.c' – Eun

嘗試調用cnt(w,x)對身體onload event

來源

2013-07-16 10:58:49 iJade

頁面加載時的Javascript字數不是keyup

回答

相關問題