如果有人使用 jquery 选择 USA，我还想要一个输入，请帮助我对 jquery 的了解不足
我的html
<!DOCTYPE html>
<html>
<head>
<title>jQuery Select Change Event For Dependent Select Option Field - Demo Preview</title>
<meta name="robots" content="noindex, nofollow">
<!-- include css file here-->
<link rel="stylesheet" href="select_jquery.css"/>
<!-- include JavaScript file here-->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript" src="select_jquery.js"></script>
</head>
<body>
<div class="container">
<div class="main">
<h2>Dependent Select Option Field Example</h2><hr/></br>
<label>Select Country:</label><br/><br/>
<div id="prm">
<select id="country">
<option>--Select--</option>
<option>USA</option>
<option>AUSTRALIA</option>
<option>FRANCE</option>
</select><br/><br/>
<label>Select City:</label><br/><br/>
<select id="city">
<!--Dependent Select option field-->
</select>
</div>
</div>
<!-- Div Fugo is advertisement div-->
<div class="fugo">
<a href="http://www.formget.com/app/"><img src="images/formget.jpg" /></a>
</div>
</div>
</body>
</html>
jquery.js
$(document).ready(function(){
//Initializing arrays with city names
var USA = [
{display: "Washington, D.C.", value: "WashingtonDC" },
{display: "Alaska", value: "Alaska" },
{display: "New York", value: "New-York" },
{display: "Florida", value: "Florida" },
{display: "Hawaii", value: "Hawaii" },
{display: "California", value: "California" }];
var AUSTRALIA = [
{display: "Canberra", value: "Canberra" },
{display: "Sydney", value: "Sydney" },
{display: "Melbourne", value: "Melbourne" },
{display: "Perth", value: "Perth" },
{display: "Gold Coast ", value: "Gold-Coast" }];
var FRANCE = [
{display: "Paris", value: "Paris" },
{display: "Avignon", value: "Avignon" },
{display: "Strasbourg", value: "Strasbourg" },
{display: "Nice", value: "Nice" }];
//Function executes on change of first select option field
$("#country").change(function(){
var select = $("#country option:selected").val();
switch(select){
case "USA":
city(USA);
break;
case "AUSTRALIA":
city(AUSTRALIA);
break;
case "FRANCE":
city(FRANCE);
break;
default:
$("#city").empty();
$("#city").append("<option>--Select--</option>");
break;
}
});
//Function To List out Cities in Second Select tags
function city(arr){
$("#city").empty();//To reset cities
$("#city").append("<option>--Select--</option>");
$(arr).each(function(i){//to list cities
$("#city").append("<option value=\""+arr[i].value+"\">"+arr[i].display+"</option>")
});
}
});
如果有人使用 jquery 选择 USA，我还想要一个输入，请帮助我对 jquery 的了解不足
最佳答案
有一个简单的方法是将输入写入您的 html 代码，并使用 display:none 隐藏它，一旦用户选中 USA 选项，您将在此处显示它，这就是您将如何处理
<select id="country">
<option>--Select--</option>
<option>USA</option>
<option>AUSTRALIA</option>
<option>FRANCE</option>
</select><br/><br/>
<input type="text" name="test" class="added" required style="display:none">
在您的 JS 文件中，您可以简单地将这一行添加到您的代码中
switch(select){
case "USA":
city(USA);
$(".added").show();
break;
关于javascript - 如果有人使用 jquery 选择美国，则需要更多输入，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/41350953/