jquery验证器与选择不工作

Question

我刚刚开始与jquery validate插件一起工作，但未能使其按预期工作。

我有一个例子了对提琴位于http://jsfiddle.net/GWABv/3/

谁能告诉我到底是什么，我做错了什么？我只是试图要求用户在下拉列表中选择一个选项，但即使我没有选择一个值，它也会回来说该表单是有效的。

HTML：

<form id="roadForm" method="get" action=""> 
    <p> 
     <label for="editRoad_ProjectClassification"> 
      <em class="red">*</em> Project Classification: 
     </label> 
     <select id="editRoad_ProjectClassification" name="editRoad_ProjectClassification" title="Please select something!" validate="required:true"> 
      <option value="">Please select</option> 
      <option value="1">1</option> 
      <option value="2">2</option> 
     </select> 
    </p> 
</form> 
<label class="FUNC_saveRecord"> 
    <span class="icon iconSave"></span> 
    <span class="title">Save</span> 
</label> 

的JavaScript：

$('.FUNC_saveRecord').click(function() { 
    saveRecord(); 
}); 


function saveRecord() { 
    var roadFormValidator = $('#roadForm').validate(); 
    if (!roadFormValidator.valid()) { 
     roadFormValidator.showErrors(); 
    } 
    else { 
     alert('form is valid'); 
    } 
} 

Answer 1

你有几个问题在这里：

1. form在开放标签拼写错误（ <focm>） 看起来像这是固定的
2. 您需要将一个class='required'属性添加到该字段中。 validate=required:true不会这样做。
3. 每次发生click时，您无需致电validate。只需拨打document.ready即可。
4. 在这种情况下无需手动拨打showErrors。插件会自动为你做这个。

这是我会怎么更新代码：

HTML：

<form id="roadForm" method="get" action=""> 
<p> 
    <label for="editRoad_ProjectClassification"> 
     <em class="red">*</em> Project Classification: 
    </label> 
    <select id="editRoad_ProjectClassification" name="editRoad_ProjectClassification" title="Please select something!" class="required"> 
     <option value="">Please select</option> 
     <option value="1">1</option> 
     <option value="2">2</option> 
    </select> 
</p> 
</form> 
<label class="FUNC_saveRecord"> 
    <span class="icon iconSave"></span><span class="title">Save</span> 
</label> 

的JavaScript：

$("#roadForm").validate(); 

$('.FUNC_saveRecord').click(function() { 
    saveRecord(); 
}); 


function saveRecord() { 
    var roadFormValidator = $('#roadForm'); 
    if (roadFormValidator.valid()) { 
     alert('form is valid'); 
    } 
} 

更新例如：http://jsfiddle.net/hRjJM/