使用jQuery比較分組選擇選項

Question

我在頁面上有幾個選擇標記，並且我使用數據屬性對它們進行分組，以確保具有相同數據鍵的那些可以進行比較。提交時，我想檢查這些組沒有選擇相同的選項值。所以想象這是一個深度圖，你有足球四分衛和跑衛列出，你想修改他們在深度圖上的位置。我不能讓兩個四分衛在深度圖上排名第一。我需要做的就是提醒用戶......「嘿，你不能爲這個位置獲得同樣的價值」，但我不確定如何使用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/

我已經設置了綁定到「評估」按鈕的點擊事件的程序。如果你想添加更多職位，比如廣泛接收者等，那麼只需添加類別名稱即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; 
      } 
     } 
    }); 
});​