Jquery-step上的表单验证:未定义不是.validate()函数上的函数

Question

我不明白发生了什么事。我正在尝试使用Jquery-step实现表单验证，当我单击next按钮时，我的表单应该会得到验证。但它不是这样的，它在验证函数时返回一个错误。

这是我的脚本

$(function () {
  $("#form-3").steps({
    bodyTag: "fieldset",
    onStepChanging: function (event, currentIndex, newIndex) {
        // Always allow going backward even if the current step contains invalid fields!
        if (currentIndex > newIndex) {
            return true;
        }

        // Forbid suppressing "Warning" step if the user is to young
        if (newIndex === 3 && Number($("#age").val()) < 18) {
            return false;
        }

        var form = $(this);

        // Clean up if user went backward before
        if (currentIndex < newIndex) {
            // To remove error styles
            $(".body:eq(" + newIndex + ") label.error", form).remove();
            $(".body:eq(" + newIndex + ") .error", form).removeClass("error");
        }

        // Disable validation on fields that are disabled or hidden.
        form.validate().settings.ignore = ":disabled,:hidden";

        // Start validation; Prevent going forward if false
        return form.valid();
    }
  });
});

我需要一个表单验证js文件才能工作吗？我尝试了一些表单验证js文件，但它仍然不起作用。谢谢。

这是我的html代码

<form id="form-3" action="#">
<h1>Account</h1>
<fieldset>
    <legend>Account Information</legend>

    <label for="userName">User name *</label>
    <input id="userName" name="userName" type="text" class="required">
    <label for="password">Password *</label>
    <input id="password" name="password" type="text" class="required">
    <label for="confirm">Confirm Password *</label>
    <input id="confirm" name="confirm" type="text" class="required">
    <p>(*) Mandatory</p>
</fieldset>

<h1>Profile</h1>
<fieldset>
    <legend>Profile Information</legend>

    <label for="name">First name *</label>
    <input id="name" name="name" type="text" class="required">
    <label for="surname">Last name *</label>
    <input id="surname" name="surname" type="text" class="required">
    <label for="email">Email *</label>
    <input id="email" name="email" type="text" class="required email">
    <label for="address">Address</label>
    <input id="address" name="address" type="text">
    <label for="age">Age (The warning step will show up if age is less than 18) *</label>
    <input id="age" name="age" type="text" class="required number">
    <p>(*) Mandatory</p>
</fieldset>

<h1>Warning</h1>
<fieldset>
    <legend>You are to young</legend>

    <p>Please go away ;-)</p>
</fieldset>

<h1>Finish</h1>
<fieldset>
    <legend>Terms and Conditions</legend>

    <input id="acceptTerms" name="acceptTerms" type="checkbox" class="required"> <label for="acceptTerms">I agree with the Terms and Conditions.</label>
</fieldset>
</form>

Answer 1

jquery-steps documentation没有任何名为valid和valid的方法。请检查您是否包含表单验证插件

Answer 2

您需要从http://jqueryvalidation.org/添加jQuery验证插件