Question

我在页面上有几个选择标记，我使用data属性对它们进行分组，以确保可以比较具有相同数据键的那些标记。在提交时，我想检查这些组没有选择相同的选项值。所以想象一下，这是一张深度图表，你已经列出了足球四分卫和跑卫，你想要修改他们在深度图表上的位置。我不能让两个四分卫在深度图上排名第一。我需要做的就是提醒用户....“嘿，你不能为这个位置提供相同的值”，但我不知道如何使用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>

Answer 1

我刚刚使用类来识别您的组，而不是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>

检查这个JS小提琴，我认为它做你想要的。如果您需要帮助解释代码，请告诉我，

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

我已经设置了一个例程来绑定“evaluate”按钮的click事件。如果要添加更多位置，例如宽接收器等，则只需添加类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;
            }
        }
    });
});

使用jQuery比较Grouped Select选项

1 个答案: