Jquery提交多個鏈接

我有一個頁面，我顯示的用戶列表和旁邊的每個用戶 - 有「添加爲朋友」鏈接。Jquery提交多個鏈接

現在當用戶點擊這個「Add as Friend」鏈接時 - 我想調用Jquery並將該請求提交給後端PHP。

通常我與jQuery的經驗涉及其在該頁面的單一形式，並通過jQuery 提交該表格 - 每個表格都有一個ID - 使用該ID我稱之爲提交功能$（「＃invite_form」）提交（函數（） - 我以這種方式訪問表單元素var emailval = $（「＃emails」）。val（）;

但是現在，我沒有表單，並且這個朋友列表正在循環中生成。所以這裏是我的疑問

1）我是否需要在循環中爲每個href標記創建一個唯一的ID

2）如何更改此$（「＃invite_form」）。submit（function（） - 它會變成（「＃ahref1」）。click（function（）其中ahref1是href標籤的唯一ID

3）如何訪問在Jquery的功能friend_id領域這是目前在href值類似於HREF =「/行動？friend_id = 32」

不知道如果我要在正確的軌道上謝謝

來源

2010-02-20 Rick

您可以使用jQuery中的$ .post（）或$ .get（）提交到後端腳本

舉例：

$("#ahref1").click(function(){ 
    var this_friend_id = $(this).prev('input.friend_id').val(); 
    // Assuming that you store the id in a hidden input field like <input type="hidden" class="friend_id" val="32" /> which is defined just before the a href. 
    $.get('/action', { 
    friend_id: this_friend_id 
    }, function(data){ 
     // callback after the ajax request 
     alert("The response is : "+data); 
    }); 
});

這應該可以解決問題。

來源

2010-02-20 09:03:51 GeekTantra

感謝GeekTantra - 但我該如何處理不同的ahref id 就像我說的 - 這些是在循環中生成的 - 所以會有10個不同的行。現在，即使我爲每個ahref標記創建了一個唯一的ID - 我將需要創建10個不同的函數，如 $（「＃ahref1」）。click（function（） $（「＃ahref2」）。click（function ） $（「＃ahref3」）。點擊（函數（） $（「＃ahref4」）。點擊（函數（）類似的問題，我會與朋友ID輸入字段感謝 – Rick 2010-02-20 09:39:59

我來補充而不是我自己的答案，因爲GeekTantra幾乎完美無缺，jQuery的神奇之處在於，選擇器可以匹配多個元素，因此只需一個點擊函數即可爲所有鏈接提供服務請注意，ID不會出現在內部GeekTantra的函數 - 它只是使用「this」來知道哪個鏈接被點擊了，所以如果你在代碼的開頭改變「$（」＃ahref1「）」爲「$（」id^='ahref'「）」該點擊功能將適用於任何id爲「ahref」開頭的元素，並且它適用於所有鏈接。 – 2010-02-20 09:51:49

Thankyou共享該信息 – Rick 2010-02-20 10:15:11

1）不，你不知道。你總是可以創建一個jQuery循環，有。每（），並自定義腳本像

$(document).ready({ 
    $('#friend_list a').each(function() { 
     // Point to current <a> 
     var $this = $(this); 
     // ... your code for each a in your list 
    }); 
});

2）您可以更改提交功能類似

$(document).ready({ 
    $('#friend_list a').each(function() { 
     var $this = $(this); 
     // Save current href 
     var href = $this.attr('href'); 
     // When user click 
     $this.click(function(e) { 
      // Doesn't follow the href path 
      e.preventDefault(); 
      // ... your custom operation here 
     }); 
    }); 
});

3）您可以使用正則表達式

$(document).ready({ 
    $('#friend_list a').each(function() { 
     var $this = $(this); 
     var href = $this.attr('href'); 
     $this.click(function(e) { 
      e.preventDefault(); 
      // Assuming your link is in form "/action?friend_id=32" 
      var re = new RegExp("\d+"); 
      var id = re.exec(href); 
      // I prefer AJAX method, this is just a sample, to complete 
      $.post('/action', 
        { friend_id: id }, 
        function(data) { 
         // ... result here 
        }); 
     }); 
    }); 
});

來源

2010-02-20 10:00:05

您的代碼示例完美匹配我的需求 Thankyou太花時間把它放在一起欣賞它 – Rick 2010-02-20 10:15:52

不客氣。 – 2010-02-20 12:52:21

Jquery提交多個鏈接

回答

相關問題