的Javascript限制逗号

Question

我有一个旁边显示的字符在该领域的数的文本域倒计时功能（认为Twitter）上

<script language="javascript" type="text/javascript"> 
function countDown(control, maxLen, counter, typeName) { 
    var len = control.value.length; 
    var txt = control.value; 
    var span = document.getElementById(counter); 
    span.style.display = ''; 
    span.innerHTML = (maxLen - len); 
    if (len >= (maxLen - 10)) { 
      span.style.color = 'red'; 
    } else { 
      span.style.color = ''; 
    } 
} 
</script> 

和下一场下来需要一个逗号分隔值。例如：

番茄，苹果，桔子，梨

，我想到该列表限制在5点事（和4个分离逗号）。

我该如何制作一个类似的函数来减少输入中逗号的数量。我是一个Javascript和Web开发的初学者，如果可以的话，我会一直陪伴着我。

在此先感谢。

我得到这个开始，但它并没有改变跨度的值。 我的JavaScript

<script language="javascript" type="text/javascript"> 
    var max = 5; 

    function commaDown(area,ticker){ 

    // our text in the textarea element 
    var txt = area.val(); 

    // how many commas we have? 
    var commas = txt.split(",").length; 

    var span = document.getElementById(ticker); 

    //var commas ++; 
    if(commas > max) { 
     // grab last comma position 
     var lastComma = txt.lastIndexOf(","); 
     // delete all after last comma position 
     area.val(txt.substring(0, lastComma)); 
     //it was count with + 1, so let's take that down 
     commas--; 
    } 
    if (txt == '') { 
     commas = 0; 
    } 
    // show message 
    span.innerHTML = (max-commas); 
    } 
</script> 

和我的HTML（我认为问题就出在这里）

<input id="choices" type="text" name="choices" class="text medium" onkeyup="commaDown('choices','limit');"/> <span id="limit">5</span><br/> 

任何想法？ （记住：我是新来的JS）

Answer 1

像这样的东西（假设你有一个文本字段ID csv）在http://www.jsfiddle.net/gaby/YEHXf/2/

---

更新回答

document.getElementById('csv').onkeydown = function(e){ 
    if (!e) var e = window.event; 
    var list = this.value.split(','); 
    if (list.length == 5 && e.keyCode == '188') 
    { 
     // what to do if more than 5 commas(,) are entered 
     // i put a red border and make it go after 1 second 
     this.style.borderColor ='red'; 
     var _this = this; 
     setTimeout(function(){ 
       _this.style.borderColor=''; 
       _this.disabled=false; 
     },1000); 
     // return false to forbid the surplus comma to be entered in the field 
     return false; 
    } 
} 

例如

你似乎混代码中的jQuery的一部分，并导致脚本失败

var max = 5; 

    function commaDown(_area, _ticker){ 
    var area = document.getElementById(_area); 

    // our text in the textarea element 
    var txt = area.value; 

    // how many commas we have? 
    var commas = txt.split(",").length; 

    var span = document.getElementById(_ticker); 

    //var commas ++; 
    if(commas > max) { 
     // grab last comma position 
     var lastComma = txt.lastIndexOf(","); 
     // delete all after last comma position 
     area.value = txt.substring(0, lastComma); 
     //it was count with + 1, so let's take that down 
     commas--; 
    } 
    if (txt == '') { 
     commas = 0; 
    } 
    // show message 
    span.innerHTML = (max-commas); 
    } 

活生生的例子在http://jsfiddle.net/z4KRd/

Answer 2

这里是一个解决：

测试：http://jsbin.com/ulobu3

代码：http://jsbin.com/ulobu3/edit

，如果你从来没有使用过jsBin，这是非常容易的，在左侧你有JavaScript代码（就像它是在你的HTML代码，并在你的右侧你有html代码。

而且您只需要将/edit添加到jsbin网址的末尾即可编辑该代码，并将任何新修订保存到该代码中。

我添加了jQuery框架，使示例更快速地进行编码。