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

时间:2013-09-21 20:28:38

标签: javascript jquery

我有一个简单的表单提交,一旦成功我就会收到警报并打电话来清除表单。我确实得到了警报,信息被成功添加到数据库中,但第二次调用 - 要清除表单,没有执行。我确定这很简单,我做错了,但我无法理解。

$('#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();

                }

此外,提交按钮只是一个按钮,而不是提交输入。是否有必要阻止默认()?我是新来的。

2 个答案:

答案 0 :(得分:3)

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();
                  }  
                });

答案 1 :(得分:0)

此行也可以使用

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