2010-12-21 88 views
11

編輯:這個工程,但不知道爲什麼?jquery - 每個/點擊功能不起作用

$('button').each(function() { 
    $(this).bind(
     "click", 
     function() { 
      alert($(this).val()); 
     }); 
    }); 

我不知道爲什麼這是不工作...現在,我只是想輸出和按鈕值的警報,但它不工作我的網頁上。我在Firebug中沒有遇到任何控制檯錯誤,也看不到任何會阻止它正常工作的東西。

我的HTML看起來像這樣:

<table id="addressbooktable"> 
<thead> 
    <tr> 
     <th>Name</th> 
     <th>Action</th> 
    </tr> 
</thead> 

<tbody> 
    <tr> 
     <td>7892870</td> 
     <td><button id="button-20" class="custom-action" value="XY89" name="info">Click</button></td> 
    </tr> 

    <tr> 
     <td>9382098</td> 
     <td><button id="button-21" class="custom-action" value="XY544" name="info">Click</button></td> 
    </tr> 

    <tr> 
     <td>3493900</td> 
     <td><button id="button-22" class="custom-action" value="XY231" name="info">Click</button></td> 
    </tr> 
</tbody> 
</table> 

,代碼如下:

$('button').each(function() { 
    $(this).click(function() { 
     alert($(this).val()); 
    } 
    }); 

但是,點擊它什麼都不做呢?我使用不正確?

+0

可能不是問題,但你不需要。每個,你可以使用含有多個節點的jQuery對象,並將它們綁定在一起。 – Shurdoof 2010-12-21 16:24:52

+0

標記答案? – hunter 2010-12-21 17:39:10

回答

20

可以綁定的所有按鈕與這樣的單擊事件,也通過他們無需環路

$(function(){ 
    $("button").click(function() { 
     alert($(this).attr("value")); 
    }); 
}); 

但更精確的選擇可能是:

$(function(){ 
    $("button[id^='button-'").click(function() { 
     alert($(this).attr("value")); 
    }); 
}); 
+0

謝謝,這個作品! – 2010-12-21 16:31:14

+0

標記爲答案? – hunter 2010-12-29 13:25:54

0

是。試試這個:

$('button').click(function() { 
     alert($(this).val()); 
    }); 

你也可以在那裏return false.preventDefault()

0

不能使用.val()方法按鈕。您可以使用.attr()來獲取值屬性。如果您使用自定義屬性,則使用data-attribute

嘗試

$("button").click(function(){ 
    alert($(this).attr("value")); 
}); 
7

你缺少);,並確保你的代碼是在document.ready處理程序,如:

$(function() { 
    $('button').each(function() { 
    $(this).click(function() { 
     alert($(this).val()); 
    }); //missing); here! 
    }); 
}); 

這樣,它不會運行,直到這些<button>元素在$('button')的DOM中找到它們。此外,您還可以在一組元素的運行.click(),像這樣:

$(function() { 
    $('button').click(function() { 
     alert($(this).val()); 
    }); 
}); 
1

你缺少)

$('button').each(function(){ 
      $(this).click(function(){ 
       alert($(this).val()); 
      }); 
     });