Question

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

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

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

HTML选择：

<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>

我想确保访问者选择任何国家但不选择“-Select Country-”，其值为0

感谢您的时间

Answer 1

根据您更新的OP：

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

HTML选择：

<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 Validate插件选中。

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/

Answer 2

您可以将min和max用于此

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

JQuery在select上验证

2 个答案: