AJAX成功回調僅執行第一個功能

Question

我有一個簡單的表單提交，成功后我有一個警報和一個電話要求清除表單。 我確實收到了警報，信息已成功添加到數據庫中，但是第二次調用（要清除表單）沒有執行。 我敢肯定，這是我做錯的簡單事情，但我無法弄清楚。

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

                }

同樣，提交按鈕只是一個按鈕，而不是提交輸入。 是否有必要阻止Default（）？ 我是新來的。

Answer 1

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

---

另一種選擇是將提交按鈕設置為context: ajax調用，然后使用其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();
                  }  
                });

Answer 2

這條線也可以使用

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