jquery验证器,选择不工作

Question

我刚开始使用jquery validate插件但是无法按预期工作.

我在Fiddle上有一个例子,位于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. validate每次click发生时都不需要打电话.只需一次打电话就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/