jquery - 每个/点击功能不起作用
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4501430/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jquery - each / click function not working
提问by newbie-shame
EDIT: this works, but not sure why?
编辑：这有效，但不知道为什么？
$('button').each(function() {
$(this).bind(
"click",
function() {
alert($(this).val());
});
});
I'm not sure why this isn't working... Right now, I'm just trying to output an alert with the button value, but it's not working on my page. I don't get any console errors in Firebug and can't see anything that would prevent it from working.
我不确定为什么这不起作用......现在，我只是想输出带有按钮值的警报，但它在我的页面上不起作用。我在 Firebug 中没有收到任何控制台错误，也看不到任何会阻止它工作的东西。
My HTML looks like this:
我的 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>
And the code looks like this:
代码如下所示：
$('button').each(function() {
$(this).click(function() {
alert($(this).val());
}
});
But, clicking on it does nothing at all? Am I using it incorrectly?
但是，点击它什么都不做？我使用它不正确吗？
回答by hunter
You can bind all buttons with a click event like this, there is no need to loop through them
您可以使用这样的点击事件绑定所有按钮，无需遍历它们
$(function(){
$("button").click(function() {
alert($(this).attr("value"));
});
});
But a more precise selector might be:
但更精确的选择器可能是：
$(function(){
$("button[id^='button-'").click(function() {
alert($(this).attr("value"));
});
});
回答by Nick Craver
You're missing a );, and make sure your code is in a document.readyhandler, like this:
您缺少);, 并确保您的代码在document.ready处理程序中，如下所示：
$(function() {
$('button').each(function() {
$(this).click(function() {
alert($(this).val());
}); //missing ); here!
});
});
This way it won't run until those <button>elements are in the DOM for $('button')to find them. Also, you can run .click()on a set of elements, like this:
这样它就不会运行，直到这些<button>元素在 DOM 中$('button')才能找到它们。此外，您可以.click()在一组元素上运行，如下所示：
$(function() {
$('button').click(function() {
alert($(this).val());
});
});
回答by Ashraf Abusada
You are missing ):
你失踪了)：
$('button').each(function(){
$(this).click(function(){
alert($(this).val());
});
});
回答by Stuart Burrows
Yup. Try this:
是的。尝试这个：
$('button').click(function() {
alert($(this).val());
});
You may also want a return falseor .preventDefault()in there.
您可能还想要一个return false或.preventDefault()在那里。
回答by rahul
You cannot use .val()method for button. You can use .attr()to get the value attribute. If you are using custom attributes then use data-attribute.
您不能使用.val()按钮的方法。您可以使用.attr()来获取 value 属性。如果您使用自定义属性，请使用data-attribute。
Try
尝试
$("button").click(function(){
alert($(this).attr("value"));
});
