如何用JS使

totsheng 2009-01-06 09:22:56

我现在在用JSP做个二级下拉框联动，是通过一级下拉框与二级下拉框的CLASS来进行匹配的。现在我想问当我判断出不属于一级下拉框的时候，怎么样使二级下拉框的<option>不显示出来？
或者哪个高手可以告诉我其他二级联动的实现方式！谢谢

function showselect()

{ 

 var value = document.getElementById('selectzg1').value;

 var index = document.forms[0].selectzg1.selectedIndex; 

 var class1 = document.getElementById('selectzg1').options[index].className;

 var num = document.getElementById('selectzg2').options.length;

 for(var i=1;i<num;i++)

  {

    var class2=document.getElementById('selectzg2').options[i].className.substring(0,2);

    if(class1.substring(0,2)!=class2)

     {

       document.getElementById('selectzg2').options[i].display='none';

     }

  }

   if(value=='all')

    $("selectzg2").style.display = "none";

   else

    $("selectzg2").style.display = "";

}

这个是我联动的JS代码

...全文

364 9 打赏收藏转发到动态举报

写回复

用AI写文章

9 条回复

切换为时间正序

请发表友善的回复…

发表回复

varlj 2009-01-06

打赏
举报

哦，没看仔细



/*

不能这么写，那个不是字符串

var zsdata=document.getElementById('zgzsdata').value;

var data={zsdata};*/



//试试这样

var zsdata=document.getElementById('zgzsdata').value;

var data= (new Function( 'return {'+zsdata+'}' ))();

varlj 2009-01-06

打赏
举报

要用{}括起来
var data={
'浙江省':['浙江城市一','浙江城市二','浙江城市三','浙江城市四','浙江城市五'],
'江西省':['江西城市一','江西城市二','江西城市三','江西城市四','江西城市五']//最后这里没,
};

totsheng 2009-01-06

打赏
举报

我参照你的写，为什么data那里会报错？说缺少符号？
zsdata的值就是这样 '建造师':['一级临时建造师','二级注册建造师'],'专业职称证书':['技术员']



var zsdata=document.getElementById('zgzsdata').value;

var data={zsdata};

varlj 2009-01-06

打赏
举报

改一下，上面的不兼容了……



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

	<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

	<title>无标题文档</title>

	<style type="text/css">

	select{width:150px;}

	</style>

</head>

<body>

<select id="sel1"><option>请选择...</option></select>

<select id="sel2"></select>

<script type="text/javascript">

var data={

	'浙江省':['浙江城市一','浙江城市二','浙江城市三','浙江城市四','浙江城市五'],

	'江西省':['江西城市一','江西城市二','江西城市三','江西城市四','江西城市五']

};

function $(id)

{

	return document.getElementById(id);

}

window.onload = function(){

	var s1 = $("sel1");

	var s2 = $("sel2");

	for(var province in data)

	{

		var opt = new Option(province,'');

		s1.options.add(opt);

	}

	

	s1.onchange = function(){

		clearCombo(s2);

		var txt = this.options[this.selectedIndex].text;

		if(data[txt])

		{

			s2.style.display="";

			var city = data[txt];

			for(var i=0;i<city.length;i++)

			{

				var opt = new Option(city[i],'');

				s2.options.add(opt);

			}

		}

		else

		{

			s2.style.display="none";//如果一级菜单没有二级就隐藏

		}

	}

}



function clearCombo(cb)

{

	while(cb.options.length>0)

		cb.remove(0);//修改一下，上面的不兼容FF了

}

</script>

</body>

</html>

varlj 2009-01-06

打赏
举报

我认为做二级联动比较方便的办法



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

	<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

	<title>无标题文档</title>

	<style type="text/css">

	select{width:150px;}

	</style>

</head>

<body>

<select id="sel1"><option>请选择...</option></select>

<select id="sel2"></select>

<script type="text/javascript">

var data={

	'浙江省':['浙江城市一','浙江城市二','浙江城市三','浙江城市四','浙江城市五'],//如果需要城市代码的，可以这样写{city:'杭州',code:'0571'}

	'江西省':['江西城市一','江西城市二','江西城市三','江西城市四','江西城市五']

};

function $(id)

{

	return document.getElementById(id);

}

window.onload = function(){

	var s1 = $("sel1");

	var s2 = $("sel2");

	for(var province in data)

	{

		var opt = new Option(province,'');

		s1.options.add(opt);

	}

	

	s1.onchange = function(){

		clearCombo(s2);

		var txt = this.options[this.selectedIndex].text;

		if(data[txt])

		{

			var city = data[txt];

			for(var i=0;i<city.length;i++)

			{

				var opt = new Option(city[i],'');

				s2.options.add(opt);

			}

		}

	}

}



function clearCombo(cb)

{

	while(cb.options.length>0)

		cb.options.remove(0);

}

</script>

</body>

</html>

totsheng 2009-01-06

打赏
举报

自顶一下，没人知道吗？

fuyou001 2009-01-06

打赏
举报

学习了

totsheng 2009-01-06

打赏
举报

[Quote=引用 6 楼 varlj 的回复:]
哦，没看仔细

JScript code
/*
不能这么写，那个不是字符串
var zsdata=document.getElementById('zgzsdata').value;
var data={zsdata};*/

//试试这样
var zsdata=document.getElementById('zgzsdata').value;
var data= (new Function( 'return {'+zsdata+'}' ))();
[/Quote]
哦，谢谢你，我还和你在线聊天联系你呢。呵呵

rjzou2006 2009-01-06

打赏
举报

var zsdata=document.getElementById('zgzsdata').value;

var data= (new Function( 'return {'+zsdata+'}' ))();

本文实例讲述了JS获取下拉框显示值和判断单选按钮的方法。分享给大家供大家参考。具体如下： 1.本人做过很多项目，都需要得到select组件显示的值。下面是我经常用到的方法： Html源码如下： <html><body&...

<html:select property="if_end"> <option value="0">否</option> <option value="1">是</option> </html:select> 将option中value的值给if_end 动态用法一： ...

Java大数据培训学校全套教程："java大数据培训学校全套教材"系列课程由750集视频构成...本门课程为"java大数据培训学校全套教材"系列课程的第二十六篇，学习DOM，option事件冒泡等概念，让大家对DOM编程打下好的基础。

思想就是找到中的值，写了一个getElementsByClassName(n)的方法，根据正则表达式跟文本值判断，然后写一个两位分隔的方法getNum(number)，最后测试具体的间隔之后判断的父节点显示隐藏或者显示。可以实现对于多少...

注：样式实现的功能：按钮变成超链接。其他代码是可编辑table，如果不可行可能是引用的jquery.min.js版本问题

JavaScript

87,922

社区成员

224,618

社区内容

发帖

与我相关

我的任务

社区管理员

加入社区

近7日
近30日
至今

加载中

查看更多榜单

社区公告

暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章

如何用JS使根据判断来显示？

如何用JS使