爲什麼我無法使用此代碼設置多選擇下拉菜單？

opts是一個數組[「1」，「2」]。選擇選項未被選中。下拉是一個引導多選插件。我在這裏錯過了什麼？爲什麼我無法使用此代碼設置多選擇下拉菜單？

var data = {}; 
data.action = "get-form-data"; 
data["account-id"] = localStorage.getItem("account-id"); 
ajax('post', 'php/enablers.php', data, formDataSuccess); 
function formDataSuccess(data) { 
    data = JSON.parse(data); 
    $("#min-rating").val(data.MinRating); 
    debugger; 
    var opts = data.AcceptedMedia.split(","); 
    $.each(opts, function(inx,val){ 
     $('#accepted-media option[value=' + val + ']').attr('selected', true);   
    }) 
    $("#special-instructions").val(data.SpecialInstructions); 
}

HTML

<html lang="en"> 
    <head> 
     <title>Writer's Tryst - Enablers Form</title> 
     <link type="text/css" href="css/enablers.css" rel="stylesheet" /> 
     <link rel="stylesheet" href="css/bootstrap-multiselect.css"> 
     <link rel="stylesheet" href="css/jquery.rateyo.min.css"> 
     <style> 
      select { 
       padding-bottom: 8px; 
      } 
     </style> 
    </head> 
    <body> 
     <div class="container center_div"> 
      <img id="img-enablers" src="#" alt="images" /> 
      <form id = "form-enablers" class="form-horizontal well"> 
       <h1>Enablers</h1>    
       <p> 
        <label for="form-type" class="fixed50">Form:</label> 
        <select id="form-type" name="form-type[]" class="btn btn-outline" multiple="multiple" required> 
        </select> 
       </p> 
       <p> 
        <label for="genres" class="fixed50">Genres:</label> 
        <select id="genres" name="genres[]" multiple="multiple" required> 
        </select><br/> 
       </p> 
       <p>For an explanation of the genres shown here, see <a target="_blank" href="https://en.wikipedia.org/wiki/List_of_genres">List of genres</a><br/></p> 
       <p> 
        <label for="accepted-media" class="fixed50">Accepted Media:</label> 
        <select id="accepted-media" name="accepted-media[]" multiple="multiple" required> 
         <option value='1'>Mail</option> 
         <option value='2'>PDF File</option> 
        </select><br/> 
       </p> 
        <label for="min-rating" class="fixed50">Minimum Rating:</label> 
        <div id="min-rating"></div> 
       <p> <label for="special-instructions" class="fixed50">Special Instructions:</label> 
        <textarea id ="special-instructions" name="special-instructions"></textarea> 
       </p> 
       <p class="thumbnail">For a limited time, enablers can use this site for <span style="color: #f00; font-weight:bold">FREE</span>. We reserve the right to change this policy without notice.</p> 
       <p id="recaptcha-elements"></p> 
       <div class="form-group">  
        <button type="submit" id="enablers-search" class="btn btn-success btn-lg btn-block glyphicon glyphicon-search"> Search</button> 
       </div> 
       <input id="userid" name="userid" type="hidden" /> 
      </form> 
     </div> 
     <form id="writers-list"> 
      <p id="manuscript-request">To request a manuscript, click the checkbox beneath the thumbs-up icon.</p> 
      <div id="table-list"></div> 
      <div id="main" class="content"></div> 

     </form> 
     <script src="js/bootstrap-multiselect.js"></script> 
     <script src="js/jquery.rateyo.js"></script> 
     <script src="js/enablers.js"></script> 
     <script src="js/recaptcha.js"></script> 
    </body>       
</html>

來源

2016-06-07 ron tornambe

如何添加HTML所以我們可以確定您的目標是正確的元素？ –

我發佈了HTML –

它適用於我：https://jsfiddle.net/barmar/0obu9zqL/7/ – Barmar