select2 js插件无法正常工作

Question

I just started using select2 jquery plugin . 我刚刚开始使用select2 jquery插件。 I am trying it on codepan . 我正在Codepan上尝试。 I added all cdn link (css,js, jquery etc) .But my select items do not change yet . 我添加了所有CDN链接（css，js，jquery等）。但是我选择的项目还没有更改。 here is my code : 这是我的代码：

<!DOCTYPE html>
<html lang="en">
<head>

<!--  Meta  -->
<meta charset="UTF-8" />
<title>My New Pen!</title>

<!--  Styles  -->
<link rel="stylesheet" href="styles/index.processed.css">
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.4/css/select2.min.css" rel="stylesheet" />
</head>
<body>

<div style="width:600px;"> 
    <form action="post"> 
        <select name="" id="myselection"> 
            <option value="dhaka"> Dhaka </option>
            <option value="braishal"> Barishal </option>
            <option value="Khulna"> Khulna </option>
            <option value="rajshahi"> Rajshahi </option>
            <option value="dinajpur"> Dinajpur </option>
        </select>
    </form>
</div>

<!-- Scripts -->
<script src="scripts/index.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.4/js/select2.min.js">
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>

<script type="text/javascript"> 
    $(document).ready(function() {
$('#myselection').select2();
   });
  </script>
</body>
</html>

Answer 1

JQuery must be imported before Select2 script for it to work. 必须先在Select2脚本之前导入JQuery，它才能起作用。

So the correct import order should be: 因此正确的导入顺序应为：

jQuery jQuery的
Select2 选择2
Page specific Javascript 页面特定的Javascript

 <!DOCTYPE html> <html lang="en"> <head> <!-- Meta --> <meta charset="UTF-8" /> <title>My New Pen!</title> <!-- Styles --> <link rel="stylesheet" href="styles/index.processed.css"> <link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.4/css/select2.min.css" rel="stylesheet" /> </head> <body> <div style="width:600px;"> <form action="post"> <select name="" id="myselection"> <option value="dhaka"> Dhaka </option> <option value="braishal"> Barishal </option> <option value="Khulna"> Khulna </option> <option value="rajshahi"> Rajshahi </option> <option value="dinajpur"> Dinajpur </option> </select> </form> </div> <!-- Scripts --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.4/js/select2.min.js"> </script> <script src="scripts/index.js"></script> <script type="text/javascript"> $(document).ready(function() { $('#myselection').select2(); }); </script> </body> </html>

select2 js插件无法正常工作

问题描述

1 个解决方案

解决方案1
2 2017-10-22 10:26:25

select2 js插件无法正常工作

问题描述

1 个解决方案

解决方案1 2 2017-10-22 10:26:25

解决方案1
2 2017-10-22 10:26:25