页面加载上的Javascript字数不是密钥

时间:2013-07-16 10:53:19

标签: javascript forms pageload onkeyup

我有一些javascript来计算一个盒子上的单词数量。 javascript看起来像这样:

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

但不知道该改变什么。

(顺便说一下,宣传册是我表格的名称。)

非常感谢任何帮助。

伊恩

4 个答案:

答案 0 :(得分:1)

您可以在cnt()事件中调用window.onload函数。

而不是收听onkeyup事件,您可以收听更合适的oninput(或onpropertychange for 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使他们&#34;安全&#34;在closure内。它们不会污染全局命名空间,全局命名空间中的东西也不会污染它们。

答案 1 :(得分:0)

onKeyUp仅触发用户互动。

如果你加载一边没有事件KeyUp

所以相反。手动触发。

手动(或cnt(document.brochure.freebrochureentryform,document.brochure.c)

呼叫您身体上的onload

答案 2 :(得分:0)

尝试在正文cnt(w,x)

上致电onload event

答案 3 :(得分:0)

function countWords(str) {
  let arr = str.split(' ');
  let count = 0;
  if(arr.length > 0){
    for (let i = 0; i< arr.length - 1; i++){
        let sentence = arr[0];
        let bool = true;
        for(let j = 0; j < sentence.length - 1; j++){
            let charcode = arr[i].charCodeAt(j);
            if((charcode > 64 && charcode < 91) || (charcode > 96 && charcode < 123)){
            bool = false;
            }
        }
        if(bool == true){
        count += 1;
        }
    }
  }
  return arr.length - count;
}

//function calling
countWords("he is a good programer, he won 865 competitions, but sometimes he dont. 
what do you think? all test-cases should pass. done-done?");