使用jQuery比较具有相同类名但不具有相同id的多个输入字段

I want to make jquery/javascript function which compare multiple values with each other if one of them comes out different then echo "Values are different" next to every field present in html body.

我想制作jquery / javascript函数,如果其中一个出现不同,则将多个值相互比较,然后在html正文中出现的每个字段旁边回显“值不同”。

<input name="flag2" type="text" id="flag2" class="flags">

<input name="flag3" type="text" id="flag3" class="flags">

<input name="flag4" type="text" id="flag4" class="flags">

<input name="flag5" type="text" id="flag5" class="flags">

<input name="flag6" type="text" id="flag6" class="flags">

Note: I use a button with jquery function to add new field on press, is using appendTo to add more fields. sometimes i have more or less fields, the jquery function must be dynamic, to apply on the number of input fields set.

注意:我使用带有jquery函数的按钮在按下时添加新字段,使用appendTo添加更多字段。有时我有更多或更少的字段,jquery函数必须是动态的,以应用于输入字段集的数量。

2 个解决方案

#1

Try each() function

尝试each()函数

$(".flags").each(function(){
 alert(this.value);
});

Link for references

参考链接

#2

You can accomplish the job with a help of two each functions in Jquery below,

您可以在Jquery下面的两个函数的帮助下完成这项工作,

Get the selector common for all the input tags say .flags, then create a loop to get all the DOM objects

获取所有输入标记的公共选项,例如.flags,然后创建一个循环来获取所有DOM对象

var temp; var start=0; var boolN=true;
$( "input.flags" ).each(function( index ) {

    if (start==0) {
        temp = $( this ).text();
    } else if (temp = $( this ).text()) {
        temp = $( this ).text();
    } else {
        boolN = false;
    }
});

Now loop the span or your custom tag to show the message. I have used a span tag here,

现在循环跨度或自定义标记以显示消息。我在这里使用了span标签,

$( "span" ).each(function( index ) {
    if (boolN) {
        $( this ).html("Values are Simillar");
    } else {
        $( this ).html("Values are Different");
    }
});

Now couple both the above methods in a custom method and bind a click event of a button like

现在将上述方法与自定义方法结合起来并绑定按钮的单击事件

$("button").click(function () {

  var temp; var start=0; var boolN=true;
    $( "input.flags" ).each(function( index ) {

        if (start==0) {
            temp = $( this ).text();
        } else if (temp = $( this ).text()) {
            temp = $( this ).text();
        } else {
            boolN = false;
        }
    });
 $( "span" ).each(function( index ) {
        if (boolN) {
            $( this ).html("Values are Simillar");
        } else {
            $( this ).html("Values are Different");
        }
    });

});

Working Example at JS Fiddle

JS Fiddle的工作实例

#1