无法使用jQuery提交第二个表单ajax

我在单个页面上有两种表单。实际上他们是分离的页面，但页面内容被加载到多个div中，通过页面实现滑动效果。无法使用jQuery提交第二个表单ajax

在一个div中，我有一个带有两个文本输入的小表单。我可以毫无问题地提交它。在另一个div我有一个联系表单。它使用相同的脚本来处理表单。唯一改变的是.submit（）应该绑定到的地方。

由于某种原因，我无法获得第二种形式的工作。页面中的表单有没有限制（我知道，这听起来很愚蠢，但我在这里无能为力......）？

的形式是这样的：

<form id='form-1'> 
.. 
</form> 

<form id='form-2'> 
.. 
</form>

jQuery的，内$(document).ready(function(){});

$("#gratis-proefles").submit(function(){ 
     var str = $(this).serialize(); 

     $.ajax({ 
      type: "POST", 
      url: "ajax.php?type=proefles", 
      data: str, 
      success: function(result){ 
       $("#ResultAanvraagProefles").ajaxComplete(function(event, request, settings){  
        if(result == true) 
        { 
         $(this).html('<span style="color:#76c5f0;"><strong>Bedankt voor je aanvraag! We nemen zo snel mogelijk contact met je op om de gratis proefles in te plannen!</strong></span>'); 
         $(":input", "#gratis-proefles") 
          .not(":button, :submit, :reset, :hidden") 
          .val("");      
        } 
        else 
        { 
         $(this).html('<span style="color:#FF0000;"><strong>Om een gratis proefles aan te kunnen vragen is het verplicht om zowel je naam als je telefoonnummer op te geven.</strong></span>'); 
        }       
       }); 
      } 
     }); 

     return false; 
    }); 

    $("#contact-formulier").submit(function(){ 
     var str = $(this).serialize(); 

     $.ajax({ 
      type: "POST", 
      url: "ajax.php?type=contact", 
      data: str, 
      success: function(result){ 
       $("#ResultContact").ajaxComplete(function(event, request, settings){  
        if(result == true) 
        { 
         $(this).html('<span style="color:#76c5f0;"><strong>Bedankt voor je bericht! We nemen zo snel mogelijk contact met je op!</strong></span>'); 
         $(":input", "#contact-formulier") 
          .not(":button, :submit, :reset, :hidden") 
          .val(""); 
        } 
        else 
        { 
         $(this).html('<span style="color:#FF0000;"><strong>Alle velden zijn verplicht in te vullen.</strong></span>'); 
        }       
       }); 
      } 
     }); 

     return false; 
    });

一个活生生的例子可以在http:vfw.ontdek5.nl/index.php找到。这是在荷兰，但形式是在'免费Proefles'和'联系'的页面上。

来源

2011-03-12 Ben

第二种形式提交回调做提醒并返回 – jimy 2011-03-12 12:03:41

那么，它从来没有出现在jQuery函数中。 .live（）似乎是解决方案。感谢您的尝试（我看到您的邮件测试邮件通过;））+1的评论。 – Ben 2011-03-12 12:11:20

试试jquery live动态加载的表单功能！

jQuery.live();

来源

2011-03-12 12:01:58 Harish

感谢您的回答，我已经尝试过了，但并不是解决方案更加迫切...... – Ben 2011-03-12 12:05:19

毕竟这是解决方案;）我忘记了将formID重命名为绑定名称。谢谢大家！ +1并接受 – Ben 2011-03-12 12:10:06

我可以在你的形式有“接触formuliers”的ID，但在你的代码是“接触formulier”示例站点的HTML看到。这个问题可能是这么简单......

来源

2011-03-12 12:03:20

感谢您的回答:)我替换了名称，因为我还使用了与免费Proefles页面完全相同的表单进行测试。与.live（）;相结合。这是解决方案。我忘了将表格重新命名为：/。 – Ben 2011-03-12 12:08:12

你必须在第二个ID的错字

contact-formulier应该contact-formuliers

来源

2011-03-12 12:03:44 rdamborsky

感谢您的回答:)我替换了名称，因为我也使用了与免费Proefles页面完全相同的表单进行测试。与.live（）;相结合。这是解决方案。我忘了将表格重新命名为：/。 – Ben 2011-03-12 12:09:05

我安静不确保您的第二种形式是如何被拉到页面，但这听起来像一个事件没有绑定，因为它被加载后页面被添加到页面。看着你使用jQuery 1.5尝试使用.delegate（http://api.jquery.com/delegate/）但在更高的水平，并在你的情况下尝试像$（'＃slider'）。委托（'输入：提交”， '点击'，功能（事件）{}）;然后，您可以选择单击哪个提交按钮，然后找到该表单并提交该表单。

来源

2011-03-12 12:13:10

无法使用jQuery提交第二个表单ajax

回答

相关问题