jQuery 在div中按名称选择输入按钮？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8247086/
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
Select input button by name in div?
提问by alex
HTML:
HTML：
<div id="div1">
<div class="row" >
<div class="span2" >
<input type=button value="" name="btn1"/>
</div>
</div>
</div>
jQuery:
jQuery：
$(document).ready(function() {
$('#div1[name="btn1"]').val('test hello');
});
Why doesn't this work?
为什么这不起作用？
Where
在哪里
$(document).ready(function() {
$('[name="btn1"]').val('test hello');
});
seems to work but i have a of other divs which i need to populate with values.
似乎工作，但我有其他 div，我需要用值填充。
Can I reuse an input element's name or must this be unique?
我可以重用输入元素的名称还是必须是唯一的？
回答by ShankarSangoli
Your selector is looking for #div1having attribute name=btn1. Try this.
您的选择器正在寻找#div1具有属性name=btn1。尝试这个。
$(document).ready(function() {
$('#div1 input[name="btn1"]').val('test hello');
});
回答by tvanfosson
The selector you are using is trying to find a DIV with the name attribute set to btn1. You should just be looking for either the input by name or an input with that name in the DIV. Note that names do not need to be unique, though ids do.
您正在使用的选择器正在尝试查找 name 属性设置为 的 DIV btn1。您应该只是在 DIV 中按名称查找输入或具有该名称的输入。请注意，名称不需要是唯一的，尽管 id 可以。
$('#div1 [name="btn1"]').val(...); // the space makes all the difference
If you only have one element on the page with that name, you can simply use
如果页面上只有一个具有该名称的元素，则可以简单地使用
$('[name="btn1"]').val(...);
回答by jwheron
You've already gotten several working solutions, but I would like to suggest something else. Why don't you add a class to your button element? Something like:
您已经获得了几种可行的解决方案，但我想提出其他建议。为什么不向按钮元素添加一个类？就像是：
<div id="div1">
<div class="row" >
<div class="span2" >
<input type="button" class="-row-button" value="" name="btn1"/>
</div>
</div>
</div>
Now, your selector is just $(".-row-button").val("test hello");
现在，您的选择器只是 $(".-row-button").val("test hello");
Why does it matter? Well, DOM traversal is really expensive, and a selector like $("#div1 [name='btn1']")is much less efficient than a class selector. That's because the simple space between #div1and [name='btn1']means jQuery is going to search through all levels of child controls under #div1. That's a bad thing.
为什么这有关系？嗯，DOM 遍历真的很昂贵，而且像选择器这样的选择器$("#div1 [name='btn1']")比类选择器效率低得多。这是因为#div1和之间的简单空格[name='btn1']意味着 jQuery 将搜索#div1. 这是一件坏事。
Even if your page is really small, you should get in the habit of doing things like this now. This change will make your jQuery code:
即使你的网页是非常小的，你应该做这样的事情的习惯，现在。此更改将使您的 jQuery 代码：
- a lot easier to follow and maintain later
- slightly more robust (because the
.-row-buttonclass can move from underneath#div1and your jQuery code would still work) - faster
- 以后更容易跟踪和维护
- 稍微更健壮（因为
.-row-button类可以从下面移动#div1并且您的 jQuery 代码仍然可以工作） - 快点
回答by Shyju
The below code will get input element under div1 and set the text to "test hello"
下面的代码将获取 div1 下的 input 元素并将文本设置为“test hello”
$(document).ready(function() {
$('#div1').find("input").val('test hello');
});
