Question

文本输入只允许三个单词用空格分隔，如果超过3，用户就不能再输入了，这是否可以使用jQuery？我可以使用keyup事件来监听，但是如何在不使用禁用的情况下阻止用户输入更多的令牌。这类似于html中输入文本的本机maxlength属性，除了在这种情况下maxLength是标记的数量。

Answer 1

检查输入是否已有3个单词，并且他们正在尝试输入空格。如果是这样，则返回false：

$('#myTextbox').keydown(
    function(event)
    {
        var input = $(this).val();
        var numberOfWords = input.split(' ').length;
        if(numberOfWords == 3 && event.keyCode == 32)
        {
            return false;
        }
    }
);

修改有一个附加问题关于有人可能会在该字段中过去文本的情况。作为一个跨浏览器解决方案，我可能会将类似@ karim79的代码绑定到blur事件。

$('#myTextbox').blur( function(e) { var tokens = $(this).val().split(' '); if(tokens.length > 3) { $(this).val(tokens.slice(0,3).join(' ')); } } );

Answer 2

编辑：这样的事情应该做（测试）：

    $('#myTextbox').keyup(function(e){
        var wordArr = $(this).val().split(' ');
        if(wordArr.length > 3 && e.keyCode == 32) {
            var arrSlice = wordArr.slice(0,3);
            var newStr = arrSlice.join(' ');
            $(this).val(newStr);
        }
    });

如果用户尝试输入三个以上的单词，则只会使用前三个单词覆盖内容。如果超过三个单词，此解决方案将显示在键入时删除的字符，从而提供一些反馈。

如果这不是理想的行为，那么@ Jataro的解决方案就是可行的方法。

Answer 3

可能是这样的，

$('#myTextbox').change(

    function()
    {
         var input = $(this).val();
         var numberOfWords = input.split(' ').length;
         if(numberOfWords > 3)
         {
              $(this).val(input.substring(0, input.lastIndexOf(' ')-1));
         }
    }
);

我还没有验证这段代码，但是这样的东西应该可行。

是的，正如mgroves所说，不要忘记重新验证服务器上的所有内容。

jquery文本输入长度控制

3 个答案: