jQuery 按类型和名称输入目标(选择器)

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/3221094/
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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 15:02:35  来源:igfitidea点击:

target input by type and name (selector)

jquery

提问by user357034

I need to change some checkbox inputs to hidden inputs for some but not all inputs on a page.

我需要将一些复选框输入更改为页面上某些但不是所有输入的隐藏输入。

<input type="checkbox" name="ProductCode"value="396P4"> 
<input type="checkbox" name="ProductCode"value="401P4"> 
<input type="checkbox" name="ProductCode"value="F460129">

The jquery code below only selects the input by type which causes all check boxes to changed to hidden inputs Is there a way to check for both type of input="checkbox" and name="ProductCode" as the selector so I can specifically target those that I want to change?

下面的 jquery 代码仅按类型选择输入,这会导致所有复选框更改为隐藏输入 有没有办法检查 input="checkbox" 和 name="ProductCode" 作为选择器的类型,以便我可以专门针对那些我想改变?

$("input[type='checkbox']").each(function(){
var name = $(this).attr('name'); // grab name of original
var value = $(this).attr('value'); // grab value of original
var html = '<input type="hidden" name="'+name+'" value="'+value+'" />';
$(this).after(html).remove(); // add new, then remove original input
});

回答by Russ Cam

You want a multiple attribute selector

你想要一个多属性选择器

$("input[type='checkbox'][name='ProductCode']").each(function(){ ...

or

或者

$("input:checkbox[name='ProductCode']").each(function(){ ...

It would be better to use a CSS class to identify those that you want to select however as a lot of the modern browsers implement the document.getElementsByClassNamemethod which will be used to select elements and be much faster than selecting by the nameattribute

最好使用 CSS 类来标识您想要选择的那些,但是因为许多现代浏览器都实现了document.getElementsByClassName用于选择元素的方法,并且比通过name属性选择要快得多

回答by cletus

You can combine attribute selectors this way:

您可以通过以下方式组合属性选择器:

$("[attr1=val][attr2=val]")...

so that an element has to satisfy both conditions. Of course you can use this for more than two. Also, don't do [type=checkbox]. jQuery has a selector for that, namely :checkboxso the end result is:

所以一个元素必须同时满足这两个条件。当然,您可以将其用于两个以上。另外,不要这样做[type=checkbox]。jQuery 有一个选择器,即:checkbox最终结果是:

$("input:checkbox[name=ProductCode]")...

Attribute selectors are slow however so the recommended approach is to use ID and class selectors where possible. You could change your markup to:

然而,属性选择器很慢,所以推荐的方法是尽可能使用 ID 和类选择器。您可以将标记更改为:

<input type="checkbox" class="ProductCode" name="ProductCode"value="396P4"> 
<input type="checkbox" class="ProductCode" name="ProductCode"value="401P4"> 
<input type="checkbox" class="ProductCode" name="ProductCode"value="F460129">

allowing you to use the muchfaster selector of:

让您使用快选择:

$("input.ProductCode")...

回答by Dani

input[type='checkbox', name='ProductCode']

That's the CSS way and I'm almost sure it will work in jQuery.

这就是 CSS 方式,我几乎可以肯定它可以在 jQuery 中工作。