我已将此plugin用于多选,而以下是我的代码。仅显示按钮。下拉列表没有显示,我一直未能找到出错的地方。请建议。
<!DOCTYPE html>
<html lang="en">
<head>
<title>Form</title>
<link href="bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="css/bootstrap-multiselect.css" type="text/css">
<link rel="stylesheet" href="css/prettify.css" type="text/css">
<script src="bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/jquery-2.1.0.min.js"></script>
<script type="text/javascript" src="js/bootstrap-multiselect.js"></script>
<script type="text/javascript" src="js/prettify.js"></script>
</head>
<body>
<form name="form1" class="form-horizontal" action="http://blahblah/blah/detr.php" onsubmit="return validateForm();" method="get">
<div class="component">
<div class="form-group">
<div class="form-group" style="text-align:center;">
<img src="img/img.png" alt="Form" />
<h2>Form </h2>
<br />
</div>
<label class="col-md-4 control-label" for="selectmultiple">Items</label>
<div class="col-md-4">
<select class="multiselect" multiple="multiple">
<option value="cheese">Cheese</option>
<option value="tomatoes">Tomatoes</option>
<option value="mozarella">Mozzarella</option>
<option value="mushrooms">Mushrooms</option>
<option value="pepperoni">Pepperoni</option>
<option value="onions">Onions</option>
</select>
</div>
</div>
</div>
</form>
<script type="text/javascript">
$(document).ready(function() {
$('.multiselect').multiselect();
});
</script>
</body>
</html>
答案 0 :(得分:3)
因为你在jquery之前加载bootstrap。您必须首先加载jquery库。从头标记更改脚本加载的顺序:
从:
<script src="bootstrap/js/bootstrap.min.js"></script> <!-- put it below-->
<script type="text/javascript" src="js/jquery-2.1.0.min.js"></script>
更改为
<script type="text/javascript" src="js/jquery-2.1.0.min.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script>