1

ページにいくつかの選択タグがあり、データ属性を使用してそれらをグループ化し、同じデータキーを持つタグを比較できるようにしています。送信時に、グループで同じオプション値が選択されていないことを確認したいと考えています。これがデプス チャートで、フットボールのクォーターバックとランニング バックがリストされていて、デプス チャートでの位置を変更したいとします。深度チャートで 2 人のクォーターバックを 1 位にすることはできません。私がする必要があるのは、ユーザーに警告することだけです....「この位置に同じ値を設定することはできません」しかし、jQuery を使用してそのポイントに到達するための比較を行う方法がわかりません。

Quarterback A
<select data-position="qb">
  <option>1</option>
  <option>2</option>
</select>

Quarterback B
<select data-position="qb">
  <option>1</option>
  <option>2</option>
</select>

Runningback A
<select data-position="rb">
  <option>1</option>
  <option>2</option>
</select>

Runningback B
<select data-position="rb">
  <option>1</option>
  <option>2</option>
</select>
4

1 に答える 1

0

jQuery データ属性の代わりに、クラスを使用してグループを識別しました。

Quarterback A
<select class="qb">
  <option>1</option>
  <option>2</option>
</select>

Quarterback B
<select class="qb">
  <option>1</option>
  <option>2</option>
</select>

Runningback A
<select class="rb">
  <option>1</option>
  <option>2</option>
</select>

Runningback B
<select class="rb">
  <option>1</option>
  <option>2</option>
</select>

<button id="eval">evaluate</button>

</p>

このJSフィドルをチェックしてください。あなたが望むことをすると思います。コードの説明が必要な場合は、お知らせください。

http://jsfiddle.net/SnJP4/5/

「評価」ボタンのクリックイベントにバインドするルーチンを設定しました。ワイドレシーバーなどの位置をさらに追加する場合は、クラスの名前をclasses配列に追加するだけです。ここ:

$('#eval').click(function() {
    var classes = ['qb','rb'];
    $(classes).each(function(index, el){
        var list = [];
        $('.'+classes[index]).each(function() {
            //alert($(this).val());
            list.push($(this).val());
        });
        list = list.sort();
        for (var i = 0; i < list.length - 1; i++) {
            if (list[i + 1] == list[i]) {
                alert('duplicate ' + classes[index]);
                break;
            }
        }
    });
});​
于 2012-04-05T15:29:15.950 に答える