1

这是一个奇怪的问题。我的设置是这样的..

<form id="main">
    <input name="title" class="required">
    <form id="searchIngredient">
          <input name="search">
          <input type="submit" name="submit" value="Search">
    <form>
    <input type="submit" name="submit" value="Add New Recipe">
</form>

现在，我尝试使用 class="required" 仅验证#main 表单中的输入，但是使用表单中的第二个#serachIngredient 表单，验证根本不起作用。

Incase You Are Wondering：#searchIngredient 表单使用 ajax 返回结果，并且由于设计原因，它需要位于 #main 表单内。

我知道 jQuery 验证在没有#searchIngredient 表单的情况下工作，但是一旦我将它添加回来，它就会停止工作，没有错误。

任何建议的解决方法或提示？

4

3 回答 3

9

That's not possible. Nested forms are not supported in HTML.

The start tag for the inner form will be ignored, and the end tag of the inner form will instead end the outer form, leaving the submit button outside the form.

You can have as many forms you like in the page, but not nested inside one another.

于 2012-07-11T01:17:40.840 回答
0

我有同样的问题，因为在 html 中不支持嵌套表单嵌套表单将被忽略，但看起来只有第一个嵌套表单会被忽略，所以对于 jquery 表单验证我尝试在主表单之后添加嵌套然后我添加表单我想验证它工作正常。

<form id="main">
<form>
</from>
    <input name="title" class="required">
    <form id="searchIngredient">
          <input name="search">
          <input type="submit" name="submit" value="Search">
    <form>
    <input type="submit" name="submit" value="Add New Recipe">
</form>
于 2015-07-18T19:58:35.617 回答
-2

我有同样的问题，我的解决方案（因为我不能没有嵌套表单）是：

<form id="main">
    <input name="title" class="required">
    <form id="searchIngredient">
          <input name="search">
          <a href="#" class="submit-link"></a>
    <form>
    <input type="submit" name="submit" value="Add New Recipe">
</form>

然后我挂钩类提交，并做我的ajax东西

$(document).on('click', 'form a.submit-link', function(e){
  e.preventDefault();
  var form = $(this).parents('form').first();
  var search = form.find('input[name="search"]').val();
  jQuery.post('my_ajax_url.php', {search: search)}, function(data, status, xhr) {
    // deal response
  });
});
于 2014-05-07T15:14:28.967 回答