0

我正在創建一個jQuery Mobile頁面,它有兩個選擇菜單,一個是多項選擇,另一個是單選項。多項選擇菜單設置爲觸發一個處理函數,該函數通過菜單中的選定值進行循環。問題是每次處理程序被觸發時,一些如何從單個選項菜單get的第一個值包含在循環中(這可以在下面實現代碼時看到)。jQuery Mobile:單選項選擇菜單值干擾多選菜單處理程序

如果任何人可以建議解決這個問題,將不勝感激。

<head> 
    <meta charset="utf-8" /> 
    <meta name="viewport" content="width=device-width,initial-scale=1" /> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/latest/jquery.mobile.min.css" 
    /> 
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script> 
    <script type="text/javascript" charset="utf-8" src="http://code.jquery.com/mobile/latest/jquery.mobile.min.js"></script> 
    <script type="text/javascript"> 
     $(function() { 

      $("#multipleChoiceMenu").on("change", { 
       testdata: "test" 
      }, multipleChoiceSelectHandler); 

      function multipleChoiceSelectHandler(e) { 
       navigationFilterGate = 0; 
       $("select option:selected").each(function (i) { 
        var optionValue = $(this).val(); 
        alert("loop " + i + " val " + optionValue); 
       }); 
      }; 
     }); 
    </script> 
</head> 

<body> 
    <div data-role="page"> 
     <div data-role="header"></div> 
     <div data-role="content"> 
      <label for="select-choice-custom">Single Choice Menu</label> 
      <select select name="singleChoiceMenu" id="singleChoiceMenu" 
      data-native-menu="false"> 
       <option value="Menu1 Value1">Menu1 Value1</option> 
       <option value="Menu1 Value2">Menu1 Value2</option> 
       <option value="Menu1 Value3">Menu1 Value3</option> 
      </select> 
      <label for="select-choice-0" class="select">Multiple Choice Menu</label> 
      <select name="multipleChoiceMenu" id="multipleChoiceMenu" 
      multiple="multiple" data-native-menu="false"> 
       <option value="Menu2 Value1">Menu2 Value1</option> 
       <option value="Menu2 Value2">Menu2 Value2</option> 
       <option value="Menu2 Value3">Menu2 Value3</option> 
      </select> 
     </div> 
    </div> 
</body> 

回答

0

這是因爲您正在使用的選擇過於籠統。

在你使用$("select option:selected").each(function (i)...的地方,你告訴jQuery選擇「選擇元素中的每個選定選項」,這當然包括單選菜單中的選定選項。

嘗試改變,爲下列之一(或者應該可以正常工作,我不知道這是更快):

$("select[name=multipleChoiceMenu] option:selected").each(function (i)... 
$("#multipleChoiceMenu option:selected").each(function (i)... 

第一個版本的名稱multipleChoiceMenu和第二選擇只選擇菜單由id。這兩個版本都應該忽略其他菜單,這就是你想要的。

+0

非常感謝!!!! –

+0

真正開心我幫助:) – 2012-06-15 02:03:37