如何知道在列表上下文中點擊了哪個jQuery按鈕

我有一個頁面上的故事列表，每個頁面上都有幾個用於不同動作的jQuery按鈕。當點擊按鈕時，我需要知道它被點擊的故事。如何知道在列表上下文中點擊了哪個jQuery按鈕

目前我的每個故事都包含在div中，ID爲story_<story_id>，然後在處理程序中遍歷並解析出ID。

<div id="story_1" class="story"> 
    Blah blah blah 
    <input type="button" class="report-button" value="Report"> 
</div> 

<div id="story_2" class="story"> 
    Blah blah blah 
    <input type="button" class="report-button" value="Report"> 
</div> 

<!-- more stories --> 

<div id="story_9" class="story"> 
    Blah blah blah 
    <input type="button" class="report-button" value="Report"> 
</div> 

<script type="text/javascript"> 
$(function() { 
    $('.report-button') 
     .button() 
     .click(function() {     
      var id_str = $(this).parents(".story").attr("id"); 
      var id = id_str.slice(6) 
      alert(id); 
     }); 
}); 
</script>

這有效，但我不知道這種技術是否存在缺點，或者如果有更好的方法。

我也想到了：

使用以id爲
把故事ID的按鈕標識和解析，一個隱藏的輸入每個故事等形式id="report_story_123"

有沒有一個標準的方法來處理這個問題？

來源

2010-08-22 cope360

你可以做到這一點使用數據屬性以及可能完全消除父ID的需要：

$(function() { 
    $('.report-button').button() 
        .click(function() {     
         alert($(this).attr('data-id')); 
        }); 
});

：

<input type="button" class="report-button" data-id="1" value="Report">

它的click事件像這樣使用.attr()然後得到You can give it a try here

來源

2010-08-22 13:02:32

尼斯。我瞭解了數據屬性和jsfiddle。 – cope360 2010-08-22 21:08:47

我不認爲真的有這樣做的標準方式。你的技術看起來很好。

現在，如果您要將此ID提交給服務器，那麼可能使用帶有隱藏字段和提交按鈕的表單更適合您，因爲您不再需要執行任何解析或依靠DOM元素嵌套順序提取這個ID。

來源

2010-08-22 12:58:09

我會按照你現在的樣子去做，但是用代替。

來源

2010-08-22 13:03:20 SLaks

嘗試這樣的事情。

<input type="button" class="report-button" name="story_9" value="Report">

和JavaScript：

var id_str = $(this).attr("name");

來源

2010-08-22 13:13:57 turbod

如何知道在列表上下文中點擊了哪個jQuery按鈕

回答

相關問題