Selectize.js根本不工作

时间:2017-05-15 10:32:07

标签: javascript jquery selectize.js

出于某种原因,我根本无法让Selectize.js参与我的项目。我已经检查了所有的jQuery链接,它们看起来很好,但当我查看页面时,我得到的只是一个简单的HTML下拉菜单。我不能直接在框中输入,并且没有选项可以自动完成或添加新条目,如http://selectize.github.io/selectize.js/(单项选择子标题)

我试图从Selectize网站复制最简单的例子,但即使这样也行不通。我可以得到一个简单的“警报”弹出框来工作,所以我知道jQuery正在工作。文件地址selectize / selectize.min.js也是正确的。

我将不胜感激。

HTML:

<!DOCTYPE html>
<html>
<head>


    <link rel="stylesheet" href="//fonts.googleapis.com/css?family=Open+Sans:400,300,600,700">
    <link rel="stylesheet" href="selectize/normalize.css">
    <link rel="stylesheet" href="selectize/styles.css">
    <link rel="stylesheet" href="selectize/default.css" data-theme="default">

    <!--[if IE 8]><script src="https://cdnjs.cloudflare.com/ajax/libs/es5-shim/2.0.8/es5-shim.min.js"></script><![endif]-->
    <script type="text/javascript" src="selectize/jquery-3.2.1.min.js"></script>

    <script type="text/javascript" src="selectize/selectize.min.js"></script>
    <script type="text/javascript" src="selectize/myjquery.js"></script>

</head>

<body>

<section class="demo" id="demo-single-item-select">
                <div class="header">
                    Single Item Select
                </div>
                <div class="sandbox">
                    <label for="select-beast">Beast:</label>
                    <select id="select-beast" class="demo-default" placeholder="Select a person...">
                        <option value="">Select a person...</option>
                        <option value="1">Chuck Testa</option>
                        <option value="4">Sage Cattabriga-Alosa</option>
                        <option value="3">Nikola Tesla</option>
                    </select>
                </div>

        <div class="description">
                    The most vanilla of examples.
                </div>

</section>


</body>
</html>

myjQuery:

$(document).ready(function() {

   //alert('Ahoy hoy');
   $('#select-beast').selectize({
                    create: true,
                    sortField: 'text',
                    searchField: 'item',
                    create: function(input) {
                        return {
                            value: input,
                            text: input
                    }
}
                });


   });

1 个答案:

答案 0 :(得分:0)

<option value="">Select a person...</option>

删除 value 属性或给它任何名称