Question

我试图通过jquery验证文本框输入，但我不知道如何在这种情况下应用某些规则。

这是交易：我希望文本框只接受字母数字输入（A-Z和0-9）并使用＆＃39; 。＆＃39;作为某些案件的分隔符。如果文本框的值为16（在这种情况下，用户必须输入类似这样的内容：67EA981XXVT110TP），那么我想验证以检查输入中是否只有字母和数字，但如果值为19（类似于：67EA.981X.XVT1.10TP），则必须检查以确认分隔符位于正确位置（每4个字符输入）并且字段中是否只有字母数字值

这就是我想要做的事情（我使用的是Razer Engine View）

            <script type="text/javascript">
                $(function () {
                    $('#txtCode').blur(function () {
                        if ($('#txtCode').val().length > 19) {
                            alert('Invalid field input!')
                        }
                        else if ($('#txtCode').val().length >= 1 && $('#txtCode').val().length < 16) {
                            alert('Invalid field input!')
                        }

                        if ($('#txtCodVerificador').val().length == 16) {
                            //check if there is only numbers and letters in the field
                        }

                        if ($('#txtCodVerificador').val().length == 19) {
                            //check if there is only numbers and letters in the field and if the separators are in the right place (every 4 character input)
                        }
                    });
                });
            </script>

Answer 1

您已提及我正在使用Razer Engine View ，因此我认为这是asp.net-mvc。您当前的实现意味着您需要在提交时再次在服务器上重复所有验证。要开箱即用，请在您的媒体资源中添加RegularExpressionAttribute

[RegularExpression(@"^[A-Z0-9]{16}|([A-Z0-9]{4}\.){3}[a-zA-Z0-9]{4}$", ErrorMessage = "...")]
public string Code { get; set; }

并在视图中

@Html.TextBoxFor(m => m.Code)
@Html.ValidationMessageFor(m => m.Code)

如果您的视图包含jquery.validate.js和jquery.validate.unobtrusive.js，那么您将获得客户端和服务器端验证（不需要您的$('#txtCode').blur(..脚本）

归功于ArcaneCraeda对正则表达式的回答。

Answer 2

试一试：

$(function () {
  $('#txtCode').blur(function () {
    if ($('#txtCode').val().match(/^[A-Z0-9]{16}$/)) {
      console.log("Matches the 16");
    }else if ($('#txtCode').val().match(/^([A-Z0-9]{4}\.){3}[a-zA-Z0-9]{4}$/)) {
      console.log("Matches the 19");
    }else{
      console.log("Does not match!");
    }
  });
});

JSFiddle

如果您对正则表达式有任何疑问，请离开！

JQuery验证 - 如何添加规则？

2 个答案: