2013-01-18 56 views
1

我使用selectmenu插件來設計我的網站上的一些選擇菜單。我在我的網站上使用它們來實現過濾功能。我希望用戶一次只能通過一個菜單進行過濾。所以當用戶在一個菜單上選擇一個選項時,其他菜單上的值需要返回到默認選項。jQuery selectmenu - 多個菜單,當其中一個被更改時重置其他值?

我有一個jsfiddle設置我想要完成的。它幾乎工作。我可以通過其他菜單將其值重置回選項列表中的第一個值。問題是我正在改變的那個不會改變,它只是保持其默認值。

希望我已經解釋得很好。這裏是鏈接到的jsfiddle ....

http://jsfiddle.net/dmcgrew/FBzFL/

這裏是我的代碼:

<select name="type" id="type"> 
<option value="*" selected="selected">Select Project Type</option> 
<option value=".annualreport">Annual Report</option> 
<option value=".branding">Branding</option> 
<option value=".brochures">Brochures</option> 
<option value=".retail-signage">Retail Signage</option> 
<option value=".video">Video</option> 
<option value=".web">Web Development</option>  
</select> 

<select name="industry" id="industry"> 
<option value="*" selected="selected" class="default">Select Project Industry</option> 
<option value=".consumergoods">Consumer Goods</option> 
<option value=".education">Education</option> 
<option value=".entertainment">Entertainment</option> 
<option value=".food">Food</option> 
<option value=".healthcare">Healthcare</option> 
</select> 

$(function(){    


$('select').selectmenu({ 
menuWidth: 170, 
width: 170, 
maxHeight: 600 
}); 

$('select#type').change(function(){ 
$("select#industry").selectmenu("index", 0); 
}); 

$('select#industry').change(function(){ 
$("select#type").selectmenu("index", 0); 
}); 



});   

回答

0

啊,理解了它!

以編程方式更改一個選擇下拉列表的值時,它將觸發附加到元素的所有更改偵聽器。所以,即使您通過UI更改了一個選擇下拉列表的值,這兩個更改偵聽器也最終都會被觸發。

編輯:很高興聽到你想通了!是的,我試圖找出一種方法來保留變化的聽衆,但它比我想象的要困難得多,除非我錯過了明顯的東西。但是,在錨元素上設置點擊監聽器應該很好地解決這個問題。

+1

我想我已經想通了。我檢測到點擊而不是