處理一個表單有多個提交按鈕
阿新 • • 發佈:2019-02-10
在做到表單的提交的時候,如果是一個按鈕提交的話,對應一個action。只需要將form表單屬性method=”post” action=”action路徑”。
可是如果是多個按鈕,如何將一個表單與多個方法關聯呢?
思路是這樣的:先不指定表單的action,讓action屬性為"",method="post",為你的提交按鈕全部替換為普通按鈕,給它們都加上onclick事件,注意這裡每一個按鈕的onclick方法是一樣的,只是傳遞的引數不一樣,這裡的引數只是起到標記是哪一個按鈕的用。
最後根據onclick裡的方法傳遞的引數不同,可以判斷是來自哪一個按鈕的訊息,再為表單設定方法並提交。
這裡有個案例(釋出文章和將文章儲存到草稿箱):
<form id="myFrm" action="" method="post">
文章標題:<input name="articleTitile"/><br/>
文章內容:<textarea name="articleContent"><br/>
<input type="button" value="釋出文章" onclick="test(1)"/><br/>
<input type="button value="儲存到草稿箱" onclick="test(2)"/>
</form>
<script type="text/javascript"> function test(val){ //判斷引數 if(val==1){ //釋出文章的方法 var url = "去到釋出文章的Action"; var params = $("#myFrm").serialize(); //非同步處理 $.post(url,params); } if(val==2){ //儲存到草稿箱 var url = "去到草稿箱的Action"; var params = $("#myFrm").serialize(); //非同步處理 $.post(url,params); } } </script>