我有代码,当选择下拉菜单中的一个选项被选中时,会出现正确的引导窗口。但是我的脚本不容易维护。我必须使用添加的每个新下拉选项将其添加到脚本中。
编写以下脚本的更有效方法是什么?如果我不需要在每个新的下拉选项和模式窗口添加到HTML的情况下添加它,则它将更加有用。
$("#selectbox").change(function () {
if ($(this).val() == "#myModal") {
$('#myModal').modal('show');
}
if ($(this).val() == "#myModal2") {
$('#myModal2').modal('show');
}
if ($(this).val() == "#myModal3") {
$('#myModal3').modal('show');
}
});
Run Code Online (Sandbox Code Playgroud)
<select class="form-control" id="selectbox">
<option value="#">
Find: App Support
</option>
<option value="#myModal">
Apple Pear Company
</option>
<option value="#myModal2">
Cold Brewing Company
</option>
<option value="#myModal3">
Jokers Wild Inc.
</option>
</select>
<div id="myModal1" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Apple Pear Company</h4>
</div>
<div class="modal-body …
Run Code Online (Sandbox Code Playgroud)我创建了以下 JS 代码。加载 HTML 文档时,脚本会正确显示三个位置数据集。
<html>
<head>
<title>Javascript Beginner</title>
</head>
<body>
<script>
pios ('a', '7886 Dublin Blvd', 'Dublin, ', 'CA ', '94568');
pios ('b', '1 Stoneridge Mall Space', 'Pleasanton, ', 'CA ', '94588');
pios ('c', '1120 Stoneridge Mall Drive', 'Pleasanton, ', 'CA ', '94566');
function pios(iID, Address, City, State, Zip)
{
document.body.innerHTML +='<p id='+iID+'></p>';
document.getElementById(iID).innerHTML = Address + '<br>' + City + State + Zip;
}
</script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
现在我明白了,我需要了解如何让这些数据出现在指定的 div 中,比如 div id=whatever?现在它只是出现在体内。
另外,我知道这段代码很粗糙,因此,想知道编写它的最佳方法是什么?