jQuery jquery多个ids相同的功能
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7861237/
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 multiple ids same function
提问by Asim Zaidi
I have a table that has a date input
我有一个有日期输入的表
<td style="background-color:#c6efce"><input type="text" id="datepicker0"></td>
<td style="background-color:#c6efce"><input type="text" id="datepicker1"></td>
<td style="background-color:#c6efce"><input type="text" id="datepicker2"></td>
<td style="background-color:#c6efce"><input type="text" id="datepicker3"></td>
<td style="background-color:#c6efce"><input type="text" id="datepicker4"></td>
I am trying to access it via for the first one
我正在尝试通过第一个访问它
<script>
$(function() {
$( "#datepicker0" ).datepicker({
showButtonPanel: true
});
});
</script>
How do I access everything?
我如何访问所有内容？
回答by James Allardice
You could use the "attribute starts-with" selector:
您可以使用“属性开始于”选择器：
$(function() {
$("input[id^='datepicker']").datepicker({
showButtonPanel: true
});
});
That selector will match any inputelement whose idvalue starts with "datepicker". An alternative would be to give all the required elements a common class.
该选择器将匹配input其id值以“datepicker”开头的任何元素。另一种方法是为所有必需的元素提供一个公共类。
You can also select multiple elements by idusing a comma-separated list:
您还可以id使用逗号分隔的列表来选择多个元素：
$("#datepicker0, #datepicker1, #datepicker2"); //List as many as necessary
But that's not particularly scalable if you ever need to add more inputs.
但是，如果您需要添加更多输入，这并不是特别具有可扩展性。
回答by Joseph Marikle
The best way is to use a class:
最好的方法是使用一个类：
<td style="background-color:#c6efce"><input type="text" class="dp" id="datepicker0"></td>
<td style="background-color:#c6efce"><input type="text" class="dp" id="datepicker1"></td>
<td style="background-color:#c6efce"><input type="text" class="dp" id="datepicker2"></td>
<td style="background-color:#c6efce"><input type="text" class="dp" id="datepicker3"></td>
<td style="background-color:#c6efce"><input type="text" class="dp" id="datepicker4"></td>
<script>
$(function() {
$( ".dp" ).each(function(){
$(this).datepicker({
showButtonPanel: true
});
})
});
</script>
but you can also use this:
但你也可以使用这个：
<td style="background-color:#c6efce"><input type="text" id="datepicker0"></td>
<td style="background-color:#c6efce"><input type="text" id="datepicker1"></td>
<td style="background-color:#c6efce"><input type="text" id="datepicker2"></td>
<td style="background-color:#c6efce"><input type="text" id="datepicker3"></td>
<td style="background-color:#c6efce"><input type="text" id="datepicker4"></td>
<script>
$(function() {
$( "#datepicker0,#datepicker1,#datepicker2,#datepicker3,#datepicker4" ).datepicker({
showButtonPanel: true
});
});
</script>
The second approach is not advised.
不建议采用第二种方法。
回答by Nathan
As I understand your question, you're trying to select multiple IDs using jQuery. Here's how you do that:
据我了解您的问题，您正在尝试使用 jQuery 选择多个 ID。这是你如何做到的：
$('#1,#2,#3')
You just separate the IDs by commas.
您只需用逗号分隔 ID。
But, this isn't the best way to accomplish this. You should really use a class: Assign each tda class and use:
但是，这并不是实现这一目标的最佳方式。您应该真正使用一个类：为每个td类分配一个类并使用：
$('td.myClass')
Alternatively, you could assign an ID to the table and select all of its tdchildren. HTML:
或者，您可以为表分配一个 ID 并选择其所有td子项。HTML：
<table id="myTable">
<td>text</td>
<td>text</td>
</table>
jQuery:
jQuery：
$('table#myTable td')
回答by Saranya Vinoth
You can use this as well
$('#datepicker0,#datepicker1,#datepicker2,#datepicker3,#datepicker4)
你也可以使用这个
$('#datepicker0,#datepicker1,#datepicker2,#datepicker3,#datepicker4)
回答by ima007
jQuery UI automatically adds the "hasDatePicker" class to all elements that have a date picker. You can query the page for something like $("input.hasDatePicker") to get all of the date pickers.
jQuery UI 会自动向所有具有日期选择器的元素添加“hasDatePicker”类。您可以在页面上查询 $("input.hasDatePicker") 之类的内容以获取所有日期选择器。
回答by millimoose
Instead of IDs, you should use a CSS class named something like has-datepickerand search for that.
您应该使用名为类似名称的 CSS 类而不是 ID，has-datepicker并搜索它。
