JQuery 在选择时验证

JQuery validate on select

本文关键字：验证 选择 JQuery      更新时间：2023-09-26

我正在使用 JQuery 验证插件来验证表单中的字段，其中包含下拉列表和其他文本字段，但我无法弄清楚如何检查下拉列表中的选定项目值是否为> 0，所以我想知道是否有人知道如何使用 JQuery 验证插件检查所选项目值？

目前，我正在使用此代码来确保下拉列表字段是必需的，但不确定如何添加验证所选值代码：

$( "#contactusform" ).validate({
  rules: {
    country: {
      required: true
    }
  }
});

网页选择：

<select id="country">
  <option value="0">-Select Country-</option>
  <option value="1">United States</option>
  <option value="2">China</option>
  <option value="3">France</option>
</select>

我想确保访问者选择任何国家，而不是值 = 0 的"-选择国家-"

感谢您抽出宝贵时间

基于您更新的 OP：

$( "#contactusform" ).validate({
    rules: {
        country: {
            required: true
        }
    }
});

网页选择：

<select id="country">
    <option value="0">-Select Country-</option>
    <option value="1">United States</option>
    <option value="2">China</option>
    <option value="3">France</option>
</select>

"我想确保访问者选择任何国家，而不是值 = 0 的"-选择国家/地区-"

这里有两个问题...

1） 你的<select>元素必须具有唯一的name属性，以便 jQuery 验证插件获取它。

2） 您的第一个<option>元素必须具有value=""才能使required规则起作用：<option value="">-Select Country-</option>

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

如果第一个<option>元素由于某种原因无法value=""，请使用min规则作为解决方法。 在这种情况下不使用required规则，因为它永远不会被调用。 我还使用 messages 选项来覆盖默认的min错误消息。

rules: {
    country: {
        min: 1
    }
},
messages: {
    country: "this field is required"
}

工作演示 2：http://jsfiddle.net/cdPs9/1/

您可以使用

min和max

$( "#contactusform" ).validate({
  rules: {
    country: {
      required: true,
      min: 1, //validates minimum value the element has to have
      max:5  // validates the max value
    }
  }
相关文章：