AJAX成功回调只执行第一个功能

我有一个简单的表单提交，成功后我有一个提醒和一个清除表单的调用。我确实收到警报，信息已成功添加到数据库中，但第二次调用 - 要清除表单没有执行。我确信这是简单的我做错了，但我无法弄清楚。AJAX成功回调只执行第一个功能

$('#contact_submit').click(function(e){ 
       if ($("#submit_form_contact").valid()) { 


        var post_data = { 
         "name" : $('#name').val(), 
         "email" : $('#email').val(), 
         "inquiry" : $('#inquiry_dropdown option:selected').text(), 
         "message" : $('#message').val() 
        }; 


        $.ajax({ 
         type: "POST", 
         url: "process-contact.php", 
         data: post_data, 
         success: function(data) { 
         alert("Thank you for contacting us."); 
         $('#submit_form_contact').reset(); 
         } 
        }); 

        e.preventDefault(); 

       }

此外，提交按钮只是一个按钮，而不是提交输入。是否有必要preventDefault（）？我是新来的。

来源

2013-09-21 Tim Aych

尝试增加'的console.log（$（ '＃submit_form_contact'））;'警报和复位之间。在日志里面应该有一个''''你可以点击来展开这个对象。看看它是否看起来像一个表单对象并具有重置方法。如果它没有reset（）方法或者在日志中推送了null或undefined，那么您已经确定了问题。 – Paul

通过“只是一个按钮”你的意思是'

啊！ Uncaught TypeError：Object [object Object]没有方法'reset'。我不完全明白 - 这是表格的ID –

jQuery没有.reset()方法。

而是执行此操作：

$('#submit_form_contact')[0].reset();

这抓住了第一个DOM元素，并调用本机.reset()。如果有任何机会，表单将不会被找到，然后测试元素。

var f = $('#submit_form_contact')[0]; 

if (f) 
    f.reset();

当然，你并不真正需要的jQuery通过ID获取元素，特别是如果你不打算使用任何jQuery方法。

var f = document.getElementbyId('submit_form_contact'); 

if (f) 
    f.reset();

另一种方法是设置提交按钮作为Ajax调用的context:，然后用其form属性。

   $.ajax({ 
        context: this, 
        type: "POST", 
        url: "process-contact.php", 
        data: post_data, 
        success: function(data) { 
        alert("Thank you for contacting us."); 
        this.form.reset(); 
        } 
       });

来源

2013-09-21 20:40:25 user2736012

非常好，我感谢您的帮助！ –

适用于上下文。没有意识到这个选择。 – Paul

这条线可以用来太

$("#submit_form_contact").trigger('reset');

来源

2013-09-22 03:45:00 wakqasahmed

AJAX成功回调只执行第一个功能

回答

相关问题