如何在我的html页面中应用选择的jQuery？
我有一个select表单所以我需要使用multiple selectby Chosen使它看起来更加用户友好.
<select class="chosen" multiple="true" name="faculty">
<option value="AC">A</option>
<option value="AD">B</option>
<option value="AM">C</option>
<option value="AP">D</option>
</select>
我已下载文件并将其复制到我的网页文件夹中.
所以,我所做的是包括chosen.jquery.min.js在<head>:
<script type="text/javascript" src="chosen/chosen.jquery.min.js"></script>
并且指令说要调用所选的插件: $(".chzn-select").chosen();
我不知道在哪里放置JavaScript语句以调用Chosen multiple select.我觉得它就像使用Bootstrap一样简单,哈.有帮助吗？
Ana*_*ass 18
你select必须拥有这个类chzn-select,通常你会在页面加载后运行一个脚本,如下所示:
$(function() {
$(".chzn-select").chosen();
});
下面是一个经过测试的工作示例:
<html>
<head>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.4.2/chosen.jquery.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.4.2/chosen.css">
</head>
<body>
<script type="text/javascript">
$(function() {
$(".chzn-select").chosen();
});
</script>
<select class="chzn-select" multiple="true" name="faculty" style="width:200px;">
<option value="AC">A</option>
<option value="AD">B</option>
<option value="AM">C</option>
<option value="AP">D</option>
</select>
</body>
</html>
如果您遵循Bootstrap的示例标记结构之一,您会注意到它们在底部(</body>标记正上方)调用了所有JavaScript文件.
你也想做同样的事; 就像是:
</div> <!-- /container -->
<!-- Le javascript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="../assets/js/jquery.js"></script>
<script src="../assets/js/bootstrap-transition.js"></script>
<script src="../assets/js/bootstrap-alert.js"></script>
<script src="../assets/js/script.js"></script> <!-- Your custom JS -->
</body>
</html>
在此script.js文件中,您需要添加以下内容:
$(function(){
$(".chzn-select").chosen();
});