JQuery实现下拉列表的联动

最新推荐文章于 2022-05-08 16:14:06 发布

RunningSunBoy

最新推荐文章于 2022-05-08 16:14:06 发布

阅读量601

点赞数

分类专栏：前端文章标签： JQuery

本文链接：https://blog.csdn.net/guoqingpei/article/details/46628277

版权

<html>
<head>
<title>下拉列表框联动</title>
<script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
//实现下拉选框的二级联动，当选择select1的值为1时，select2的选项为11和12；当选择select1的值为2时，select2的选项为21和22；
function appendToOption(textk,v,selected)
{
var obj = $("<option>").text(textk).val(v);
if(selected)
{
obj.attr("selected","true");
}
obj.appendTo($("#select2"));
}
//根据第一个框的选项获取第二个下拉框的可选值
function getItemsToAppend(selectedValue)
{
var options = new Array();
if(selectedValue=="1")
{
options.push("11","12");
}
else if(selectedValue=="2")
{
options.push("21","22");
}
else
{
options.push("31","32");
}
return options;

}
//用console.log进行调试
$(function(){
$("#select1").change(function(){
var selectedValue =