jQuery Jquery选择div内的按钮
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11871777/
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 Select button(s) inside div
提问by RenRock
I would like to select a specific group of buttons that exist inside a DIV and assign their ID to a hidden field on the page but I cant for the life of me select the buttons inside the div.. Example fails below
我想选择存在于 DIV 中的一组特定按钮，并将它们的 ID 分配给页面上的隐藏字段，但我一生都无法选择 div 中的按钮。下面的示例失败
SOURCE HTML
源 HTML
<div id = test>
<div class="ButtonGroupWrapper">
<img src="test.jpg" width="100" height="100" alt="thumbnail" />
<input id="buttonID5" type="submit" value="Link" class="button" />
</div>
<div class="ButtonGroupWrapper">
<img src="test.jpg" width="100" height="100" alt="thumbnail" />
<input id="buttonID6" type="submit" value="Link" class="button" />
</div>
</div>
Jquery selector fails
Jquery 选择器失败
$(".ButtonGroupWrapper").find(":button").click(function () {
alert("hi there");
return false;
});
$("#ButtonGroupWrapper input[type=button]").click(function () {
alert("hi there");
return false;
});
$("#ButtonGroupWrapper :button").click(function () {
alert("hi there");
return false;
});
回答by j08691
Try:
尝试：
$(".ButtonGroupWrapper").find(".button").click(function () {
alert("hi there");
return false;
});
Your first example fails because you're trying to target a class which is preceded by .not :. You may also be trying to target an element of type button but the element in question is of type submit.
你的第一个例子失败了，因为你试图定位一个前面有.not 的类:。您可能还试图定位一个按钮类型的元素，但该元素的类型是提交。
Your second example fails because you're trying to select an input of type button when none exist (your target is type submit). An alternative would be input[type=submit].
你的第二个例子失败了，因为你试图在不存在时选择类型按钮的输入（你的目标是类型提交）。另一种选择是input[type=submit]。
Your third example fails for a similar reason to the first example failing in that it's looking for an element of type button.
您的第三个示例失败的原因与第一个示例失败的原因类似，因为它正在寻找类型为 button 的元素。
回答by Digital Visual
Putting a space looks for any .button class within your .ButtonGroupWrapper class. (NOTE: not any 'button', but anything with the code class="button" added to it)
放置一个空格会查找 .ButtonGroupWrapper 类中的任何 .button 类。（注意：不是任何“按钮”，而是任何添加了代码 class="button" 的东西）
$(".ButtonGroupWrapper .button").click(function () {
alert("hello");
return false;
});
In your HTML code the submit input has a 'class' of 'button'. It could actually be anything such as .strawberry or .mybutton or anything you like.
在您的 HTML 代码中，提交输入具有“按钮”的“类”。它实际上可以是诸如 .strawberry 或 .mybutton 之类的任何内容或任何您喜欢的内容。
Alternative:
选择：
As you have an id wrapping the whole lot you could also target button within the id:
由于您有一个 id 包裹整个批次，您还可以将按钮定位在 id 中：
<div id ="test">
<div>
<img src="test.jpg" width="100" height="100" alt="thumbnail" />
<input type="submit" value="Link" class="button" />
</div>
<div>
<img src="test.jpg" width="100" height="100" alt="thumbnail" />
<div class="button" />Just text</div>
</div>
</div>
And then your javascript could be:
然后你的 javascript 可能是：
$("#test .button").click(function () {
alert("button class clicked");
return false;
});
Remember you need to run this after the DOM has loaded, so best practice is to either write it at the end of the page or wrap it in your favourite onready function.
请记住，您需要在 DOM 加载后运行它，因此最佳实践是将它写在页面的末尾或将它包装在您最喜欢的 onready 函数中。
回答by wanovak
This will work:
这将起作用：
$(".ButtonGroupWrapper").find(".button").click(function () {
alert("hi there");
return false;
});
