使用jquery获取带有类的元素的不同名称

时间:2012-10-30 10:12:54

标签: javascript jquery

我有以下HTML:

单选按钮列表:

<input name="rdLst163" class="required_Mandatory_RbtLst" id="rdLst163_1" onclick="fn("1631");" type="radio" value="1"/>
<input name="rdLst163" class="required_Mandatory_RbtLst" id="rdLst163_2" onclick="fn("1632");" type="radio" value="2"/>
<input name="rdLst163" class="required_Mandatory_RbtLst" id="rdLst163_3" onclick="fn("1633");" type="radio" value="3"/>

<input name="rdLst164" class="required_Mandatory_RbtLst" id="rdLst164_1" onclick="fn("1641");" type="radio" value="1"/>
<input name="rdLst164" class="required_Mandatory_RbtLst" id="rdLst164_2" onclick="fn("1642");" type="radio" value="2"/>
<input name="rdLst164" class="required_Mandatory_RbtLst" id="rdLst164_3" onclick="fn("1643");" type="radio" value="3"/>

复选框列表:

<input name="chLst165" class="required_Mandatory_ChkLst" id="chkLst165_1" onclick="fn("25");" type="checkbox" value="1"/>
<input name="chLst165" class="required_Mandatory_ChkLst" id="chkLst165_2" onclick="fn("25");" type="checkbox" value="2"/>
<input name="chLst165" class="required_Mandatory_ChkLst" id="chkLst165_3" onclick="fn("25");" type="checkbox" value="3"/>

<input name="chLst166" class="required_Mandatory_ChkLst" id="chkLst166_1" onclick="fn("25");" type="checkbox" value="1"/>
<input name="chLst166" class="required_Mandatory_ChkLst" id="chkLst166_2" onclick="fn("25");" type="checkbox" value="2"/>
<input name="chLst166" class="required_Mandatory_ChkLst" id="chkLst166_3" onclick="fn("25");" type="checkbox" value="3"/>

以及以下jQuery:

<script>
$(document).ready(function () {
  $('.required_Mandatory_ChkLst[name!=]'); 
  $('.required_Mandatory_RbtLst[name!=]');
// result is fetching all 6 elements. I need only distinct element names [here 2 elements] in each class.
});
</script>

如何在jQuery中获取类的不同元素名称?

必填结果:

["rdLst163", "rdLst164"]  
["chLst165", "chLst166"]

6 个答案:

答案 0 :(得分:4)

var cbnames = [];
$('.required_Mandatory_ChkLst[name!=]').map(function() {
    return this.name;
}).each(function(i, str) {
    if (!~$.inArray(str, cbnames)) cbnames.push(str);
});
console.log(cbnames); //["chLst165", "chLst166"]

Fiddle

简单地说,这个解决方案将maps元素的名称放入一个jQuery对象包装的数组中,该数组为iterated,并且唯一值为pushed到数组中。


映射不是很必要,所以为了简单起见,您也可以跳过该步骤。

var cbnames = [];
$('.required_Mandatory_ChkLst[name!=]').each(function() {
    if (!~$.inArray(this.name, cbnames)) cbnames.push(this.name);
});
console.log(cbnames); //["chLst165", "chLst166"]

Fiddle

答案 1 :(得分:2)

您可以执行以下操作:

演示http://jsfiddle.net/DvegQ/

<强>代码:

var classNames = [];
$('*').each(function() { classNames[$(this).attr('name')] = 1; });
for(var x in classNames) { console.log(x); }

答案 2 :(得分:2)

我相信你想要的是这个

var mapped = $('.required_Mandatory_ChkLst[name!=], .required_Mandatory_RbtLst[name!=]').map(function() {
    return $(this).attr('name');
});

var unique = mapped.filter(function (i, itm) {
    return i == $.makeArray(mapped).indexOf(itm);
});

console.log(unique);

首先,我们将dom元素的集合映射到具有所述元素名称的字符串值的集合。 其次,我们过滤这个名称集合,只包含唯一的实例。

注意:其他答案建议使用jQuery.unique。然而,此方法适用于dom元素的集合,在您的情况下,所有这些都是唯一的。

答案 3 :(得分:1)

filter()类似:

$(function(){
    var names = [];
    $('.required_Mandatory_RbtLst').each(function(){

        if($.inArray($(this).prop('name'), names) === -1)
            names.push($(this).prop('name'));
    });

    console.log($(names));
});​

答案 4 :(得分:0)

您可以使用jQuery .unique()方法

jQuery.unique($('.required_Mandatory_RbtLst[name!=]'));

参考:http://api.jquery.com/jQuery.unique/

答案 5 :(得分:0)

试试这个

var names = $("input").map(function(){ return $(this).attr('name'); });
var distinctNames = $.unique(names);

在此处详细了解地图功能http://jqapi.com/#p=map