使用 JQuery 防止电子邮件输入字段上的“”，“和”;“

Prevent "," and ";" on an email input field with JQuery

本文关键字：字段 JQuery 电子邮件 输入 使用      更新时间：2023-09-26

我想防止在Jquery的输入字段中使用"，"和";"。到目前为止，我一直在尝试这个解决方案：

.HTML：

<input name="txt_correu-e" type="text" id="gestio_usuaris_editaCompta_txt_correu-e" size="50" maxlength="50" class="">

JQUERY：

$('#gestio_usuaris_editaCompta_txt_correu-e').keypress(function (e) {
    var filter = /([,;])/;
    var campo = $("#gestio_usuaris_editaCompta_txt_correu-e").val();
    if (filter.test(campo)) {
        e.preventDefault();
    }
 });

但是对我不起作用，因为输入仍然打印字符，然后不会让我继续在输入中写入。我只是希望输入不显示这些字符，但让我继续编写电子邮件地址。

为了防止用户键入,和;，您可以简单地执行以下操作： 

$("#target").keypress(function( event ) {
    if ( event.which == 44 || event.which == 59 ) {
        event.preventDefault();
    }
    // other instructions
});

编辑：

要验证电子邮件地址，您可以使用：

function is_valid_email(email) {
    var regex = /^([a-zA-Z0-9_.+-])+'@(([a-zA-Z0-9-])+'.)+([a-zA-Z0-9]{2,4})+$/;
    return regex.test(email);
}

您可以在文本字段上的任何所需事件( keyup， ... (中调用它。

您也可以使用 HTML5 电子邮件输入：

<form>
    E-mail: <input type="email" name="email">
</form>

希望能有所帮助。

就像我在评论中所说的那样，没有必要使用 jQuery 或 JavaScript 来做到这一点，并且通过 keyPress 事件限制输入不是一个好的做法，因为任何人都可以复制和粘贴内容(即使有"邪恶"意图(。

以下解决方案将允许除"，"和";"之外的任何字符。当然，请记住，这还不足以确保电子邮件地址有效。

<form>
    <input type="text" pattern="^[^,;]*$" required/>
    <input type="submit">
</form>

http://jsfiddle.net/parvmck7/

如果您有疑问，请告诉我。

更新：我没有意识到您需要它与IE8兼容。如果是这种情况，您可以尝试使用任何HTML5 Polyfills(https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-Browser-Polyfills#web-forms(。否则，JavaScript 将是。

$("#target").on('keyup click blur',function( event ) {
      var regex = new RegExp('^([A-Z0-9_.+-])+'@(([A-Z0-9-])+'.)+([A-Z0-9]{2,4})+$/', 'i');
      if(!regex.exec($(this).val())){
          $(this).val("");
          event.preventDefault();
    });

为了避免插入不需要的字符，您应该收听 keyup 事件(键盘(，单击 event( 以防止右键单击和粘贴 ;：-包含文本(和模糊事件(如果已通过 TAB 键选择输入以粘贴 ;：-包含文本(。

有关其他邮件验证策略，请参阅 regular-expressions.info

相关文章：