如何使用JQuery處理表單中的幾個提交按鈕？

Question

我需要創建30個按鈕，從1到30，其中每個人都調用完全相同的動作腳本（例如全部在相同的形式下），其中傳遞給動作腳本的參數只是按下的按鈕的編號1至30）。例如，假設action腳本是process.php，如果按下按鈕3，那麼我需要從process.php？btn = 3中提取數據，如果按下按鈕27，則需要拉動數據表格process.php？btn = 27。

用JQuery做這件事最簡單，最直接的方法是什麼？

謝謝！

Answer 1

這樣的事情應該這樣做。 beforeSend函數只是爲了向你展示發送給服務器的內容。

$('button').click(function (e) { 
    e.preventDefault(); 
    var number = $('form button').index(this); 
    $.ajax('process.php', { 
     data: 'number='+ number, 
     beforeSend: function (jqHxR, settings) { 
      alert(settings.data); 
      return false; 
     } 
    }); 
}); 

編輯： http://jsfiddle.net/EvilAmarant7x/NhMnP/

Answer 2

假設您給您的所有鏈接的類.number：

$("a.number").click(function(e) { 
    e.preventDefault(); 
    window.location.href = 'process.php?btn=' + $(this).text(); 
}); 

<a class="number" href="#">1</a> 
<a class="number" href="#">2</a> 
... 

這似乎是那最好在服務器端完成，東西的種類爲使服務器與正確的呈現每個href參數值。我是，假設這不是你的情況下的選項。

編輯：異步性，如要求：

$("a.number").click(function(e) { 
    e.preventDefault(); 

    // fill up div with ID="results" with content from server 
    $("#results").load("process.php", { btn: $(this).text() }, function() { 

     // callback to do something once the content has loaded 
     // (perhaps not needed) 

    }); 
}); 

<div id="results"></div> 
... 
<a class="number" href="#">1</a> 
<a class="number" href="#">2</a> 
... 

見$.load和$.ajax。