探索 jQuery-UI-Multiselect-Widget：一款高效多选下拉插件
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery UI Multiselect Widget 示例</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="https://raw.githubusercontent.com/ehynds/jquery-ui-multiselect-widget/master/src/jquery.ui.multiselect.css">
<script src="//code.jquery.com/jquery-1.12.4.js"></script>
<script src="//code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="https://raw.githubusercontent.com/ehynds/jquery-ui-multiselect-widget/master/src/jquery.ui.multiselect.js"></script>
<script>
$(function() {
$("#languages").multiselect();
});
</script>
</head>
<body>
<select id="languages" name="languages" multiple="multiple">
<option value="en">English</option>
<option value="fr">Français</option>
<option value="es">Español</option>
<option value="de">Deutsch</option>
<option value="it">Italiano</option>
</select>
</body>
</html>这个代码示例展示了如何在HTML页面中引入并初始化jQuery UI Multiselect Widget插件。首先，我们通过<link>和<script>标签引入了必要的CSS和JavaScript资源。然后，我们在页面加载完毕后使用$("#languages").multiselect();来初始化多选下拉列表。这个简单的示例可以作为开发者学习和集成该插件的起点。
评论已关闭