實現jQuery插件選擇不生效

我是JavaScript和jQuery的新手，但我嘗試使用Chosen插件。我已經按照我所能找到的所有步驟進行了操作，但沒有奏效。這是我迄今爲止所做的。實現jQuery插件選擇不生效

index.blade.php：

<html lang="en" ng-app="wim"> 
    <head> 
     <meta charset="utf-8"> 
     <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
     <meta name="viewport" content="width=device-width, initial-scale=1"> 

    <title>WIM(afy)</title> 

    <link href="bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"> 
    <link href="css/wimmain.css" rel="stylesheet"> 
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> 
    <link href="bower_components/chosen/chosen.css" rel="stylesheet"> 

    <script src="bower_components/angular/angular.min.js"></script> 
    <script src="bower_components/lodash/lodash.js"></script> 
    <script src="bower_components/angular-route/angular-route.min.js"></script> 
    <script src="bower_components/angular-local-storage/dist/angular-local-storage.min.js"></script> 
    <script src="bower_components/restangular/dist/restangular.min.js"></script> 

    <script src = "js/app.js"></script> 
    <script src = "js/services.js"></script> 
    <script src = "js/controllers.js"></script> 

    <style> 

     li { 
      padding-bottom: 8px; 
     } 

    </style> 
</head> 

<body style="background-color: lightgray;">  
    <div ng-view></div> 

    <script src="bower_components/jquery/dist/jquery.min.js"></script> 
    <script src="bower_components/chosen/chosen.jquery.js"></script> 
    <script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script> 

    <script> 
     $(document).ready(function(){ 
      $(".chosen-select").chosen(); 
     }); 
    </script> 
</body>

我已經包含在頂部的樣式表，之後我包括jQuery和我的腳本之前包括chosen.jquery.js。實際的HTML頁面顯示在<div ng-view></div>處。

這裏的HTML：

<select class="chosen-select" id="interests" multiple="true" ng-model="interests"> 
    <option value="Art">Art</option> 
    <option value="Biking">Biking</option> 
    <option value="Camping">Camping</option> 
    <option value="Coffee">Coffee</option> 
    <option value="Concerts">Concerts</option> 
    <option value="Dining">Dining</option> 
    <option value="Running">Running</option> 
    <option value="Shopping">Shopping</option> 
</select>

現在它只是顯示，你必須按住Shift或使用Ctrl鍵選擇多個事物的正常HTML 5的多個選擇列表。

我需要不同的左右移動我的代碼？有人能幫我弄清楚我做錯了什麼嗎？謝謝。

來源

2016-07-18 Tom

''＃= ID-選擇，'.' =類的選擇，現在仔細檢查您的HTML和JS – empiric

@empiric我編輯了以上問題，我仍然得到正常的HTML多重選擇 – Tom

不知道這是你的問題，但我不得不觸發之前選擇的更新。嘗試$("#interests").trigger("update")

來源

2016-07-18 19:06:20 larz

改爲\t '' 並沒有運氣 – Tom

嗯，我也只注意到你指的是'＃chosen'但是這似乎並沒有在你的HTML存在。試試'$（「＃interest」）。選擇（）' – larz

不幸運！：/不知道還有什麼其他的嘗試 – Tom

實現jQuery插件選擇不生效

回答

相關問題