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

Question

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

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

下面的jquery代码只选择按类型输入,这会导致所有复选框更改为隐藏输入是否有办法检查输入类型="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
});

Answer 1

您想要一个多属性选择器

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

要么

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

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

Answer 2

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

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

因此元素必须满足两个条件.当然,你可以使用它超过两个.另外,不要这样做[type=checkbox].jQuery有一个选择器,即:checkbox最终结果是:

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

属性选择器很慢,因此推荐的方法是尽可能使用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">

让您使用多快选择:

$("input.ProductCode")...

Answer 3

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

这是CSS的方式,我几乎可以肯定它将在jQuery中工作.