jQuery Validation Plugin规则内函数为何未按预期返回布尔值？

嘿，我来帮你搞定这个问题！你遇到的情况其实挺常见的，大概率是你的规则函数里踩了几个容易忽略的小坑，导致不管隐藏框值是啥都返回true。我给你分析下可能的原因，再给你一套能正常工作的代码示例。

常见的错误原因 #

• 值类型不匹配：隐藏输入框的val()方法返回的是字符串类型，如果你直接用===和数字1/2比较，会因为类型不匹配导致判断错误（比如字符串"1"和数字1用===比较会返回false）。
• 缺少明确的返回值：如果你的函数在某些分支里没写return语句，函数会默认返回undefined，而jQuery Validation插件会把undefined当作验证通过（也就是true）。
• 选择器错误：如果你的选择器没正确选中隐藏输入框，获取到的值始终是undefined或者不符合预期的内容，也会导致逻辑出错。

正确的实现代码 #

先看补全后的HTML结构（方便测试）：

<form id="userForm">
  <input type="hidden" name="pick" id="pick" value="1"/>
  <label for="username">用户名:</label>
  <input type="text" name="username" id="username" placeholder="请输入用户名"/>
  <button type="submit">提交</button>
</form>

然后是JavaScript部分，我用了自定义验证方法的方式，逻辑更清晰：

// 先注册自定义验证规则
$.validator.addMethod("checkPickValue", function(value, element) {
  // 获取隐藏框的值并转成数字，第二个参数10指定十进制，避免意外问题
  const pickVal = parseInt($("#pick").val(), 10);
  
  // 处理值不是数字的异常情况，这里默认返回true，你可以根据需求调整
  if (isNaN(pickVal)) {
    return true;
  }
  
  // 核心逻辑：等于2返回true（验证通过），等于1返回false（验证失败）
  return pickVal === 2;
}, "当前不允许提交该字段（pick值为1）");

// 初始化表单验证
$("#userForm").validate({
  rules: {
    username: {
      required: true, // 先确保用户名不能为空
      checkPickValue: true // 应用我们的自定义规则
    }
  },
  messages: {
    username: {
      required: "请输入用户名"
    }
  },
  // 验证通过后的处理函数
  submitHandler: function(form) {
    alert("验证通过！准备提交表单");
    form.submit();
  }
});

帮你避坑的错误示例 #

比如你之前可能写了这样的错误代码：

// 错误示例1：类型不匹配导致判断错误
rules: {
  username: {
    required: function() {
      const pickVal = $("input[name='pick']").val();
      // 这里用===比较字符串和数字，永远不会匹配到1
      if (pickVal === 1) {
        return false;
      } else {
        return true;
      }
    }
  }
}

// 错误示例2：缺少返回值
rules: {
  username: {
    required: function() {
      const pickVal = parseInt($("input[name='pick']").val());
      // 只有当值为2时才返回true，其他情况没有return，默认返回undefined
      if (pickVal === 2) {
        return true;
      }
    }
  }
}

这两种情况都会导致你的规则函数始终返回true，按照我给的正确代码调整后，就能正常根据隐藏框的值返回对应的布尔值了。

内容的提问来源于stack exchange，提问作者MichaelJorgensenDK