1

jQueryを使用して複数の入力フィールド値を比較し、「類似した値があります」という一致アラートがある場合はどうすればよいですか?

<input value="111"> //similar
<input value="222">
<input value="111"> //similar
<input value="333">

上記のこの HTML コードは、同じ値が 2 つあるため、「類似した値があります」と警告する必要があります。jQueryでどのように行うことができますか?

私が試した（次のコードは機能しません）：

デモ: http://jsfiddle.net/HpWLQ/

$('input').each(function () {
    var $this = $(this);
    var val = $this.val();
    vals.push(val);
});
for (var i = 0; i < vals.length; i++) {
    for (var n = 0; n < vals.length; n++) {
        if (n !== i) {
            if (vals[i] === vals[n]) {
                alert('There are similar values');
            }
        }
    }
}
4

5 に答える 5

2

編集: @Raynos を満たすために、ここに純粋な JS ソリューションがあります。

var vals = {};
var flag = false;
var collection = document.getElementsByTagName('input');
collection = [].slice.call(collection);

collection.forEach(function(element, index, array) {
    if (flag === true) return;
    var i = element.value;
    if (vals[i])
    {
        flag = true;
        alert('There are duplicates!');
    }
    else
    { 
        vals[i] = 1;
    }
});

</p>

おまけ: jsperf を使用してソリューションを実行しました。最後のものは明らかに断然最速です。

編集：おそらくあなたの問題を解決するjQueryの方法は次のとおりです（Working fiddle here）。私の元の答えは以下のままです。

var duplicatefound = false;
$('input').each(function(index, item){
    if (duplicatefound) return;
    val = $(item).val();
    if ($('input[value="' + val + '"]').length == 1) return;
    duplicatefound = true;
    alert('There are similar values');
});

重複した値の一部またはすべてを取得する必要がある場合の代替ソリューション(作業フィドルはこちら) :

var collection = $('input');
var duplicates = $.map(collection, function(item){
    val = $(item).val();
    return ($('input[value="' + val + '"]').length > 1) ? val : null;
});

if(duplicates.length > 0) alert('There are similar values');

vals他の人が言及したように、配列としての宣言が欠落していたため、.push()失敗していました。

オブジェクトベースのソリューションがよりエレガントであることに気付くかもしれません: Working fiddle

var vals = {};

$('input').each(function() {
    var index = $(this).val();
    if (vals[index])
    {
        vals[index]++
    }
    else
    { 
        vals[index] = 1;
    }
});

var duplicates = $.map(vals, function(val, key){
    return (val > 1) ? key : null;
});

if (duplicates.length > 0) alert('There are duplicates!');
于 2012-04-08T12:31:45.207 に答える
1

valsを配列として定義していません。あなたはそれを次のように定義することができます

vals = [];

デモ

于 2012-04-08T12:23:27.980 に答える
1 
var inputs = $("input"), similar = [], i, j;

for (i = 0; i < inputs.length; i += 1) {
    for (j = i + 1; j < inputs.length; j += 1) {
        if (inputs[i].value === inputs[j].value) {
            similar.push([i,j]);
        }
    }
}

if (similar.length > 0) {
    alert('There are similar values');
}​

これは一意の順列を順番に比較するだけであり、これが興味深い場合に備えて、同様の配列内の一致するインデックスの配列を提供することに注意してください。

例: http://jsfiddle.net/sjCGy/

jQuery セレクターの代わりに document.getElementsByTagName を使用して、jQuery の依存関係を簡単に削除できます。

@Raynos は読めないので、明示的にします。

var inputs = document.getElementsByTagName("input"), similar = [], i, j;

for (i = 0; i < inputs.length; i += 1) {
    for (j = i + 1; j < inputs.length; j += 1) {
        if (inputs[i].value === inputs[j].value) {
            similar.push([i,j]);
        }
    }
}

if (similar.length > 0) {
    alert('There are similar values');
}​
于 2012-04-08T12:31:15.247 に答える
1 
EDITED 2:    

function findDuplicates()
{
    var dupCount = 0;
    $('input').each(function () {
         var $currentInput = $(this);
         $('input').each(function () {
              if($(this).val() == $currentInput.val() && $(this) != $currentInput)
                   dupCount++;
         });
     });
     if(dupCount > 0) alert("There are " + dupCount + "duplicates!");
}
于 2012-04-08T12:25:47.370 に答える
0

コードが機能します。vals配列の宣言が欠落しているだけです-更新されたフィドルを参照してください

于 2012-04-08T12:26:48.050 に答える