我正在尝试使用Select2库。但是我什么都没露面。即使我尝试了这个简单的示例,也没有用。 HTML文件,CSS文件和JS文件都在同一文件夹中。

当我加载此浏览器是完全空白。

<!DOCTYPE html>
<html lang="en">
<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>title</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <link href="select2.css" rel="stylesheet" />
    <script src="select2.js"></script>
</head>
<body>
    <div class="controls-group">
        <div class="controls">
            <script type="text/javascript">
                $(".example-basic-multiple").select2();
                <select class="example-basic-multiple" multiple="multiple">
                    <option value="AL">Alabama</option>
                    <option value="WY">Wyoming</option>
                </select>
            </script>
        </div>
    </div>
</body>
</html>

最佳答案

链接到JS库后,您需要将<select>放在脚本标签之外,最好放在<head>中:

       <!DOCTYPE html>
        <html lang="en">
        <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>title</title>
            <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
            <link href="select2.css" rel="stylesheet" />
            <script src="select2.js"></script>
            <script>
                $(function() {//Waits until the page is fully loaded before running code
                $(".example-basic-multiple").select2();
                });
            </script>
        </head>
        <body>
            <div class="controls-group">
                <div class="controls">
                    <select class="example-basic-multiple" multiple="multiple">
                        <option value="AL">Alabama</option>
                        <option value="WY">Wyoming</option>
                    </select>
                </div>
            </div>
        </body>
        </html>

关于javascript - HTML文档中的选择元素未显示,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/28705192/

10-11 22:20