Question

解决方案： 我在烧瓶中以错误的方式引用了css和其他js文件，它必须像这样完成：

<script src="{{ url_for('static', filename="js/jquery.multiselect.js")}}"></script>
<link rel= "stylesheet" type= "text/css" href= "{{ url_for('static',filename='styles/jquery.multiselect.css') }}">

我使用以下指南创建了一个带有复选框（或至少我尝试过）的下拉列表：https://www.codexworld.com/multi-select-dropdown-list-with-checkbox-jquery/ 但是，下拉菜单显示不正确，看起来像图片中所示。我的html：

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js">$
<script src="multiselect/jquery.multiselect.js"></script>
<link rel="stylesheet" href="multiselect/jquery.multiselect.css">
<script src="{{ url_for('static', filename="js/drug_response.js")}}"></script>
</head>
<body>
<select name="drug" multiple id="drug">
    {% for drug in drugs %}
            {% if drug == current_drug %}
                    <option selected value="{{ drug }}">{{ drug }}</option>
            {% else %}
                    <option value="{{ drug }}">{{ drug }}</option>
            {% endif %}
    {% endfor %}
</select>
</body>

和我的js：

$('select[multiple]').multiselect();
$('#drug').multiselect({
columns: 1,
placeholder: 'Select drugs'
});

编辑：将js更改为：

$(function(){
 $drug_list = $('#drug');
    $drug_list.multiselect();
    });

但没有帮助。

我不是很精通前端开发，所以现在我可能会出什么毛病。

复选框下拉框未正确显示

0 个答案: