使用jQuery提交表單

Question

我有一個頁面上的格式如下：

<form action="/" method="post"> 
<select id="SelectedMonth" name="SelectedMonth"> 
<option>7/1/2017</option> 
<option>6/1/2017</option> 
</select> 
</form> 

我嘗試使用下面的jQuery片段提交表單。 jquery代碼駐留在表單之外，並且表單是頁面上唯一的表單。

$("#SelectedMonth").change(function() { 
     alert(this.value); 
     $('form').submit(function (event) { 
     alert("Submitted"); 
     event.preventDefault(); 
     }); 
    }); 

第一個警報被觸發並顯示選定的值，但提交從未觸發。

看起來這是非常簡單的，但它不工作。我錯過了什麼？

TIA

Answer 1

改變行動和讓它空白 和改變功能這樣

$("#SelectedMonth").change(function() { 
    $('form').submit(); 
}); 

，也將努力

Answer 2

這是因爲，儘管你可以更改或刪除選擇的元素向下（從而導致第一alert()火），你有沒有機制提交表單，所以第二個沒有。

您需要添加一個submit按鈕，以便可以觸發form的submit事件。

此外，您擁有代碼的方式，除非先在下拉列表中更改您的選擇，否則事件處理程序不會實際觸發。你可能不想要這種行爲。這兩個事件處理程序應該彼此獨立設置。

$("#SelectedMonth").change(function() { 
 
    alert(this.value); 
 
}); 
 

 
$('form').submit(function (event) { 
 
    alert("Submitted"); 
 
    event.preventDefault(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form action="/" method="post"> 
 
    <select id="SelectedMonth" name="SelectedMonth"> 
 
    <option>7/1/2017</option> 
 
    <option>6/1/2017</option> 
 
    </select> 
 
    <button type="submit">Submit</button> 
 
</form>

Answer 3

你把更改事件內提交事件嘗試，並添加一個提交按鈕提交事件

$("#SelectedMonth").change(function() { 
     alert(this.value); 
    }); 

$('form').submit(function (event) { 
     event.preventDefault(); 
alert("Submitted"); 
     }); 

，如果你希望提交日期chaneg然後再試這

$("#SelectedMonth").change(function() { 
      $('form').trigger('submit'); 
     }); 

    $('form').submit(function (event) { 
      event.preventDefault(); 
    alert("Submitted"); 
      }); 

Answer 4

回答這個問題：「爲什麼它不工作」是.submit（函數（）{}）實際上沒有提交形成但增加submit handler - 當表單將提交

This method is a shortcut for .on("submit", handler) in the first variation, and .trigger("submit") in the third.

Description: Bind an event handler to the "submit" JavaScript event, or trigger that event on an element.

將要執行的功能

所以如果你傳遞函數給它，它會綁定處理程序。當你不用params觸發它時，它實際上會提交表單。

你不需要按鈕來提交表單。

所以實際的代碼必須是這樣的

$('form').submit(function (event) { 
    alert("Submitted"); 
    event.preventDefault(); 
}); 
$("#SelectedMonth").change(function() { 
    $('form').submit(); 
});