jQuery的多個選擇 - 如何得到通知時，選擇的項目，並知道選擇哪個項目

Question

我有一個「城市」的多選列表框包含框：

1 - 第一項是「所有城市」

2 - 其餘項目都在選定的國家城市

我想實現以下行爲：

1 - 當選擇了第一項（「所有城市」），取消選擇任何其他項目（取消選擇已經選擇的城市項目）

2 - 如果除第一個任何項目，如果它的選擇被選中（一個城市被選中），取消選擇的第一個項目（但不要取消選擇所選擇的任何其他城市）

我已經試過處理的onChange - 但我不知道如何得到哪個是最後選擇的項目。

任何幫助表示讚賞。

Answer 1

好的，所以我假設通過說「多選列表框」你的意思是<select multiple>元素。

然後在這裏我們去...

你提到不需要任何操作的第一個行爲，因爲當你單擊另一個選項，而不CTRL (or CMD in Mac)按壓從這種選擇的默認動作是取消選擇所有選項。

對於第二個，您必須監聽select元素的更改，然後驗證是否選擇了AllCities選項以及是否有其他options已選中。

因此，代碼會我想......

你有HTML：

<select id="cities" multiple> 
    <option value="All" selected>All Cities</option> 
    <option value="A">City A</option> 
    <option value="B">City B</option> 
    <option value="C">City C</option> 
</select> 

和腳本偵聽更改，如果選項All處於選中狀態，如果有選擇的另一選項太：

$('#cities').on('change',function(){ 
    var it = $(this); 
    if(it.val().indexOf("All") > -1 && it.val().length > 1){ 
     $('option[value="All"]',it).prop('selected',false); 
    } 
}); 

Here is a fiddle以顯示其行爲。