查找是否存在重复的name属性

时间:2015-02-18 23:42:40

标签: javascript jquery

我们说我有以下内容;

<input type="text" id="1" name="1" value="" />
<input type="text" id="2" name="2" value="" />
<input type="text" id="3" name="3" value="" />
<input type="text" id="4" name="2" value="" />

我正在尝试使用能够确定是否存在具有相同名称的属性的函数。

因此,对于此示例,将出现一个红色标记,id="4"具有重复的名称属性。

我知道我必须做这样的事情,但我可能会在这里咆哮。你们觉得怎么样?

function findDuplicates(name) {
    var found = 0;

    $("input").each(function() { 
         if($(this).attr('name') == name)
            found++;
    });

    return found;
}

5 个答案:

答案 0 :(得分:4)

尝试使用jQuery属性选择器:

if(1 < $('input[name=2][type=text]').length) {
    //duplicate
}

所以你的功能如下:

function findDuplicates(name) {
    return $('input[name='+ name +']').length;
}

修改

用简单的JS:

function findDuplicates(name) {
    return document.getElementsByName(name).length;
}

答案 1 :(得分:0)

在某个地方创建一个空div,假设我给了我的div一个id为“return_value”。

<script>
function validate(){
    var name1 = document.getElementById("1").value;
    var name2 = document.getElementById("2").value;
    var name3 = document.getElementById("3").value;
    var name4 = document.getElementById("4").value;

    var error = '';

    error = (name1 == name2 || name1 == name3 || name1 == name4 || name2 == name3 || name2 == name4 || name3 == name4) ? 'Duplicate Entry!' : 'Data OK!';

    getElementById("return_value").innerHTML = error;

}   
</script>

你只需让你的表单onsubmit调用Javascript函数进行比较,如果你想在数据有效的情况下实际提交表单,你可以使用AJAX来做。以前的海报是正确的,如果没有更多关于你试图做什么的信息,很难回答这个问题。

答案 2 :(得分:0)

var found = 0;
var array = new Array(); //create new array

$( "input[type=text]" ).each(function( index ) {
    var name = $(index).attr('name'); //get name of current element
    if(array.indexOf(name) == -1) //check if name doesn't exist in array
    {
      array.push(name); //if true, add it to the array
    } else {
      found++; //if it exists, increment found
      var duplicate = $(index).attr('id'); //get the id of the current element
      console.log('Input with Id = ' + duplicate + ' has a duplicate name attribute');
    }


});

答案 3 :(得分:0)

如果从长度减1,则可以返回0表示没有重复。

我还传入元素和属性名称以获得完全可重用性。

function hasDuplicates(el, attr, value) {
    return $(el + '[' + attr + '=' + value + ']').length - 1;
}

答案 4 :(得分:0)

其他答案要求您知道要查找的属性的名称,这是没有道理的,如果他知道输入字段的名称,则可以在浏览器中查看源,并查看是否有两个元素找到相同的名称。

使用以下代码,您可以将其复制并粘贴到浏览器的控制台窗口中:

var found = 0;
var array = new Array(); //create new array

$("input[type=text]").each(function( index ) {
    var name = $(index).attr('name'); //get name of current element
    if(array.indexOf(name) == -1) //check if name doesn't exist in array
    {
         array.push(name); //if true, add it to the array
    } else {
         found++; //if it exists, increment found
         var duplicate = $(index).attr('name'); //get the name of the duplicate element
         console.log('Input with Name => ' + duplicate + ' has a duplicate name attribute');
    }
});