如何使用jquery设计两个对应的下拉菜单， 250
但第一个显示水果时，第二个会显示出三个水果的值，当地一个显示蔬菜时，第二个会显示三个蔬菜的值，不用hide和show，使用jquery去改变html。如何设置html和j...
但第一个显示水果时，第二个会显示出三个水果的值，当地一个显示蔬菜时，第二个会显示三个蔬菜的值，不用hide和show，使用jquery去改变html。如何设置html和jquery。
展开
2个回答
展开全部
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
是这样的吗？
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="js/jquery.js" ></script>
<script>
$(function(){
//姑且当你的数据是这样的
var data = {1:["苹果","橘子","香蕉"], 2:["黄瓜","韭菜","萝卜"]};
$(".father").on("change", function(){
var category = $(this).val();
var $detail = $(".detail");
$detail.empty();
if(category){//选了具体的种类才改变下面的 选择框的值
$.each(data[category], function(){
//把具体的种类追加到第二个下拉框
$('<option> ' + this+'</option>').appendTo($detail);
});
}else {
$('<option>--请选择--</option>').appendTo($detail);
}
});
});
</script>
</head>
<body>
<select class="father">
<option value="">-choose-</option>
<option value="1">水果</option>
<option value="2"> 蔬菜</option>
</select>
<br />
<select class="detail">
<option>--请选择--</option>
</select>
</body>
</html>
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
