如何使用jQuery来防止空格键进入空格？

Question

我认为在表单输入中劫持空格键是一件简单的事情,这样它就像连字符一样起作用.通常jQuery使这样的东西非常简单.

我试过的代码是这样的:

        $("#StreamUrl").keydown(function (e) {
            if (e.keyCode == 32) return 109;
        });

但这没有任何效果.我尝试了一个更简单的脚本:

        $("#StreamUrl").keydown(function (e) {
            //if (e.keyCode == 32) return 109;
            alert(e.keyCode);
        });

此脚本在空间按下时正确警告32,在连字符按下时正确警告109.此外,我没有JavaScript错误.

为什么不行if (e.keyCode == 32) return 109;？当我更换那条线时,if (e.keyCode == 32) alert("space!!");我正确地得到警报,所以我知道正确地if返回true.

是什么赋予了？

编辑 - 解决方案

感谢@Nick指出了复制粘贴问题.我最后得到了一点混合动力.这是我已经开始工作的代码,它既平滑又处理复制/粘贴.

        $("#StreamUrl").keydown(function (e) {
            if (e.keyCode == 32) {
                $(this).val($(this).val() + "-"); // append '-' to input
                return false; // return false to prevent space from being added
            }
        }).change(function (e) {
            $(this).val(function (i, v) { return v.replace(/ /g, "-"); }); 
        });

Answer 1

问题是return 109不能做你想做的事.在事件处理程序中,根据您是否希望浏览器执行默认操作,返回true或false.在keydown,您将返回false以防止插入该字符.

$("#StreamUrl").keydown(function (e) {
     if (e.keyCode == 32) { 
       $(this).val($(this).val() + "-"); // append '-' to input
       return false; // return false to prevent space from being added
     }
});

jsfiddle的例子

Answer 2

你通常希望keyup事件发生在这里,在添加空间后触发,这样的事情会更容易:

$("#StreamUrl").bind("keyup change", function () {
  $(this).val(function(i, v) { return v.replace(/ /g,"-"); });
});

在这里尝试一下,这样做是为了允许添加空间,但是通过传递函数立即替换连字符的空格.val().对于旧版本的jQuery,它看起来像这样:

$("#StreamUrl").bind("keyup change", function () {
  $(this).val($(this).val().replace(/ /g,"-"));
});

这甚至适用于粘贴内容的人,这是一种简单的方法来绕过keydown验证.