Question

是否可以在下面的输入表单中不允许空白字符/空格？

<input type="text" value="" maxlength="30" name="email" class="formfield w0">

Answer 1

检查Fiddle。相关代码：

$(function() {
    $('#input1').on('keypress', function(e) {
        if (e.which == 32)
            return false;
    });
});

Answer 2

使用HTML5的扩展输入类型来应用约束验证，这将阻止在现代浏览器中使用无效的电子邮件提交表单：

<input type="email" value="" maxlength="30" name="email" class="formfield w0">

在旧版浏览器中，您可以检测到输入的类型不是“电子邮件”，因为当值被视为无效时，它将默认为“文本”。我建议阻止提交表单，而不是阻止空格键的默认操作，这可能是通过粘贴或通过其他输入方法无意中绕过的。

以下代码就是一个例子，应该在文档准备好后执行：

var frm = document.getElementById('myform');

if (frm.email.type === 'text') {
    frm.onsubmit = function () {
        if (/\s/.test(frm.email.value)) {
            // Tell your user the field is invalid here, e.g.
            frm.email.className = 'invalid';

            // Prevent form submission
            return false;
        }
    }
}

工作演示：http://jsfiddle.net/hgc7C/

不要忘记这不能替代服务器端表单验证。

Answer 3

是的，可以使用javascript / JQuery。

如果您想要所有文本框，请执行以下操作。

$(function() {
    $('.formfield input[type=text]').on('keypress', function(e) {
        if (e.which == 32)
            return false;
    });
});

如果您希望将其用于特定文本框，请在文本框输入中添加ID，并将.formfield input[type=text]替换为#textBoxId

输入表单中不允许使用空白字符/空格

3 个答案: