下拉框一系列触发

最新推荐文章于 2021-12-03 09:01:08 发布

猩猿亿码

最新推荐文章于 2021-12-03 09:01:08 发布

阅读量160

点赞数

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

本文链接：https://blog.csdn.net/qq_44316726/article/details/109382712

版权

前端专栏收录该内容

17 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<script type="text/javascript" src="js/jquery-1.4.js"></script>

	<body>

		<div class="item_top clearfix">
			<div class="column_name fl" id="echarts_titie">各维度数据按地市统计</div>
			<div class="filter fr">
				<select name="cxwd" id="cxwd" onchange="switWdSelect(this.value)">
					<option value="1">按地市</option>
					<option value="2">按时间</option>
					<option value="3">按鉴定类别</option>
					<option value="4">按委托主题</option>
				</select>
				<select name="cxzlb" id="cxzlb" onchange="switchselect(this.value)">
					<option value="1">鉴定机构</option>
					<option value="2">鉴定人</option>
					<option value="3">鉴定案件</option>
					<option value="4">收费金额</option>
				</select>
			</div>
		</div>

		<div class="charts" id="demo1" style="display: block">111</div>
		<div class="charts" id="demo2" style="display: block">222</div>
		<div class="charts" id="demo3" style="display: block">333</div>
		<div class="charts" id="demo4" style="display: block">444</div>
		<div class="charts" id="demo5" style="display: block">555</div>
		<div class="charts" id="demo6" style="display: block">666</div>

	</body>
	<script>
		function switWdSelect(ele) {
			if(ele == "1") {
				//initAnalysisBar1("1");//发送一个ajax请求
				$("#echarts_titie").html("各维度数据按地市统计----1");
				$("#cxzlb option").remove();
				$("#cxzlb").append("<option value='1'>鉴定机构</option>");
				$("#cxzlb").append("<option value='2'>鉴定人</option>");
				$("#cxzlb").append("<option value='3'>鉴定案件</option>");
				$("#cxzlb").append("<option value='4'>收费金额</option>");
				$("#demo1").css("display", "block"); //显示
				$("#demo2").css("display", "none");
				$("#demo3").css("display", "none");
				$("#demo4").css("display", "none");
				$("#demo5").css("display", "none");
				$("#demo6").css("display", "none");
			} else if(ele == "2") {
				//initAnalysisBar2("1");//发送一个ajax请求
				$("#echarts_titie").html("鉴定案件及费用按时间统计---2");
				$("#cxzlb option").remove();
				$("#cxzlb").append("<option value='1'>鉴定机构</option>");
				$("#cxzlb").append("<option value='2'>鉴定人</option>");
				$("#cxzlb").append("<option value='3'>鉴定案件</option>");
				$("#cxzlb").append("<option value='4'>收费金额</option>");
				$("#demo1").css("display", "none");
				$("#demo2").css("display", "block");
				$("#demo3").css("display", "none");
				$("#demo4").css("display", "none");
				$("#demo5").css("display", "none");
				$("#demo6").css("display", "none");
			} else if(ele == "3") {
				//initAnalysisBar3("1");//发送一个ajax请求
				$("#echarts_titie").html("鉴定案件按鉴定类别统计---3");
				$("#cxzlb option").remove();
				$("#cxzlb").append("<option value='1'>鉴定案件</option>");
				$("#cxzlb").append("<option value='2'>收费金额</option>");
				$("#demo1").css("display", "none");
				$("#demo2").css("display", "none");
				$("#demo3").css("display", "block");
				$("#demo4").css("display", "none");
				$("#demo5").css("display", "none");
				$("#demo6").css("display", "none");

			} else if(ele == "4") {
				//initAnalysisBar4("1");//发送一个ajax请求
				$("#echarts_titie").html("鉴定案件按委托主体统计---4");
				$("#cxzlb option").remove();
				$("#cxzlb").append("<option value='1'>鉴定案件</option>");
				$("#cxzlb").append("<option value='2'>收费金额</option>");
				$("#demo1").css("display", "none");
				$("#demo2").css("display", "none");
				$("#demo3").css("display", "none");
				$("#demo4").css("display", "none");
				$("#demo5").css("display", "block");
				$("#demo6").css("display", "none");
			}
		}
	</script>

</html>