Question

如果在此代码中单击了提交按钮且名称字段中没有任何内容，则validate（）函数应该启动并说“此字段是必需的”。这工作正常，直到我添加服务器端表单标记。一旦这个标签在那里（我将需要它用于页面上的其他东西，validate（）函数似乎根本不运行，因为页面立即执行回发，其中validate（）函数阻止表单提交时验证失败。

以下代码是非工作代码。如果我取出行和最后一个结束表单标记（标记，它有效 - 它验证，显示“此字段是必需的”，并成功阻止表单加载。

所以我的问题是，为什么这不适用于服务器端表单标签？

<!DOCTYPE html>
<html>
    <head>
      <script src="http://code.jquery.com/jquery-latest.js"></script>
      <script type="text/javascript" src="http://jzaefferer.github.com/jquery-validation/jquery.validate.js"></script>
      <script type="text/javascript">
          $(document).ready(function () {
              $("#nameForm").validate();
          });
      </script>
    </head>
    <body>
        <form id="form1" runat="server">
            <form id="nameForm" method="get" action="">
                <p>
                    <label for="cname">Name</label>
                    <em>*</em>
                    <input id="cname" name="name" size="25" class="required" minlength="2" />
                </p>
                <p>
                    <input class="submit" type="submit" value="Submit"/>
                </p>
            </form>
        </form>
    </body>
</html>

Answer 1

Floradu88指出，有两个表格是不正确的，下面的代码（删除其中一个表格），现在似乎工作正常，谢谢！

<!DOCTYPE html>
<html>
    <head>
      <script src="http://code.jquery.com/jquery-latest.js"></script>
      <script type="text/javascript" src="http://jzaefferer.github.com/jquery-validation/jquery.validate.js"></script>
      <script type="text/javascript">
          $(document).ready(function () {
              $("#form1").validate();
          });
      </script>
    </head>
    <body>
        <form id="form1" runat="server">
            <p>
                <label for="cname">Name</label>
                <em>*</em>
                <input id="cname" name="name" size="25" class="required" minlength="2" />
            </p>
            <p>
                <input class="submit" type="submit" value="Submit"/>
            </p>
        </form>
    </body>
</html>

Answer 2

这是因为html嵌套表单不支持嵌套表单会被忽略，你可以通过在主表单后添加空来解决它

你的代码

<!DOCTYPE html>
<html>
    <head>
      <script src="http://code.jquery.com/jquery-latest.js"></script>
      <script type="text/javascript" src="http://jzaefferer.github.com/jquery-validation/jquery.validate.js"></script>
      <script type="text/javascript">
          $(document).ready(function () {
              $("#nameForm").validate();
          });
      </script>
    </head>
    <body>
        <form id="form1" runat="server">
 <form></form>
            <form id="nameForm" method="get" action="">
                <p>
                    <label for="cname">Name</label>
                    <em>*</em>
                    <input id="cname" name="name" size="25" class="required" minlength="2" />
                </p>
                <p>
                    <input class="submit" type="submit" value="Submit"/>
                </p>
            </form>
        </form>
    </body>
</html>

参考链接 jQuery Validation Issue with a form inside a form

服务器端<form>标记阻止jQuery验证插件验证</form>

2 个答案: