Question

我不是想象力的网络开发人员，所以这可能是一个非常基本的问题。

我试图从网站上的an example复制基本表单。这是我的完整index.html：

<!DOCTYPE html>
<html>
<head>
  <script src="jquery-3.1.0.js"></script>
  <script src="jquery.steps.min.js"></script>
  <script src="bootstrap.min.js"></script>
  <link href="bootstrap.min.css" rel="stylesheet" type="text/css">
</head>
<body>
  <div class="container" id="wizard">
  <section id="basic-form">
    <h2 class="page-header">Basic Form Example</h2>
      <form id="example-form" action="#">
          <h3>Account</h3>
          <section>
              <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>
          </section>
          <h3>Profile</h3>
          <section>
              <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">
              <p>(*) Mandatory</p>
          </section>
          <h3>Finish</h3>
          <section>
              <input id="acceptTerms" name="acceptTerms" type="checkbox" class="required"> <label for="acceptTerms">I agree with the Terms and Conditions.</label>
          </section>
      </form>
    </div>
  </section>
  <script>
    var form = $("#example-form").show();

    form.validate({
      errorPlacement: function errorPlacement(error, element) { element.before(error); },
        rules: {
                confirm: {
                    equalTo: "#password"
                }
            }
        });


    form.children("div").steps({
        headerTag: "h3",
        bodyTag: "section",
        transitionEffect: "slideLeft",
        onStepChanging: function (event, currentIndex, newIndex)
        {
            form.validate().settings.ignore = ":disabled,:hidden";
            return form.valid();
        },
        onFinishing: function (event, currentIndex)
        {
            form.validate().settings.ignore = ":disabled";
            return form.valid();
        },
        onFinished: function (event, currentIndex)
        {
            alert("Submitted!");
        }
    });
  </script>
</body>
</html>

当我打开这个文件时，我没有得到任何好的引导样式，并且我得到form.validate({ //...不是函数的错误。

我在jquery.steps.min.js搜索validate方法，实际上，我找不到。

为什么这个例子没有开箱即用？我错过了这个例子中的一些东西吗？

Answer 1

表单验证不是jQuery Steps的一部分。您需要包含＆＃34; jQuery Validation Plugin＆＃34;

为什么我的jquery-steps向导给出了一个没有定义错误的函数？

1 个答案: