手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >dropdownlist之间的互相联动实现(显示与隐藏)
dropdownlist之间的互相联动实现(显示与隐藏)
摘要:复制代码代码如下:varArrchange1=newArray();varArrchange2=newArray();varArrchang...

复制代码 代码如下:

<script language="javascript" type ="text/javascript" >

var Arrchange1 =new Array ();

var Arrchange2 =new Array ();

var Arrchange3 =new Array ();

function hide(s_id,index)

{

var xxx = document .getElementById (s_id);

var oldOption = xxx.children(index);

var oldStr = oldOption.innerText;

var newOption = document.createElement('<div' + oldOption.outerHTML.match(/(<w*)([^>]*)(>)/)[2] +'>');

newOption.innerText= oldStr;

newOption.swapNode(oldOption);

//alert(xxx.innerHTML);

}

function show(s_id,index)

{

var xxx =document .getElementById (s_id);

var oldOption = xxx.children(index);

if(oldOption.tagName=='DIV')

{

var oldStr = oldOption.innerText;

var newOption = document.createElement('<option' + oldOption.outerHTML.match(/(<w*)([^>]*)(>)/)[2] +'>');

newOption.innerText = oldStr;

newOption.swapNode(oldOption);

}

//alert(xxx.innerHTML);

}

function onchange1()

{

var s_index=document .getElementById ("Ddl_question1").options[document .getElementById ("Ddl_question1").selectedIndex].value;

s_index = parseInt(s_index);

if(s_index ==0)

{

show ('Ddl_question2',Arrchange1 [0] );

show ('Ddl_question3',Arrchange1 [0] );

Arrchange1.pop();

}

else

{

Arrchange1.push(s_index);

if(Arrchange1.length>0)

{

show ('Ddl_question2',Arrchange1 [0] );

}

if(Arrchange1.length>0)

{

show ('Ddl_question3',Arrchange1 [0] );

}

hide('Ddl_question2',s_index);

hide('Ddl_question3',s_index);

}

}

function onchange2()

{

var s_index=document .getElementById ("Ddl_question2").options[document .getElementById ("Ddl_question2").selectedIndex].value;

s_index = parseInt(s_index);

if(s_index ==0)

{

show ('Ddl_question1',Arrchange1 [0] );

show ('Ddl_question3',Arrchange3 [0] );

Arrchange2.pop();

}

else

{

Arrchange2.push(s_index);

if(Arrchange2.length>0)

{

show ('Ddl_question1',Arrchange2 [0] );

}

if(Arrchange2.length>0)

{

show ('Ddl_question3',Arrchange2 [0] );

}

hide('Ddl_question1',s_index);

hide('Ddl_question3',s_index);

}

}

function onchange3()

{

var s_index=document .getElementById ("Ddl_question3").options[document .getElementById ("Ddl_question3").selectedIndex].value;

s_index = parseInt(s_index);

if(s_index ==0)

{

show ('Ddl_question1',Arrchange3 [0] );

show ('Ddl_question2',Arrchange3 [0] );

Arrchange3.pop();

}

else

{

Arrchange3.push(s_index);

if(Arrchange1.length>0)

{

show ('Ddl_question1',Arrchange3 [0] );

}

if(Arrchange2.length>0)

{

show ('Ddl_question2',Arrchange3 [0] );

}

hide('Ddl_question1',s_index);

hide('Ddl_question2',s_index);

}

}

function a() {alert("fuck ");}

</script>

<select name="Ddl_question1" id="Ddl_question1" onchange="onchange1()">

<option value="0">请选择密保信息</option>

<option value="1">您母亲的姓名是?</option>

<option value="2">您父亲的姓名是?</option>

<option value="3">您配偶的姓名是?</option>

<option value="4">您的出生地是?</option>

<option value="5">您高中班主任的姓名是?</option>

<option value="6">您初中班主任的姓名是?</option>

<option value="7">您小学班主任的姓名是?</option>

<option value="8">您小学校名是?</option>

<option value="9">您的学号(或工号)是?</option>

<option value="10">您父亲的生日是?</option>

<option value="11">您母亲的生日是?</option>

<option value="12">您配偶的生日是?</option>

</select>

<select name="Ddl_question2" id="Ddl_question2" onchange="onchange2()">

<option value="0">请选择密保信息</option>

<option value="1">您母亲的姓名是?</option>

<option value="2">您父亲的姓名是?</option>

<option value="3">您配偶的姓名是?</option>

<option value="4">您的出生地是?</option>

<option value="5">您高中班主任的姓名是?</option>

<option value="6">您初中班主任的姓名是?</option>

<option value="7">您小学班主任的姓名是?</option>

<option value="8">您小学校名是?</option>

<option value="9">您的学号(或工号)是?</option>

<option value="10">您父亲的生日是?</option>

<option value="11">您母亲的生日是?</option>

<option value="12">您配偶的生日是?</option>

</select>

<select name="Ddl_question3" id="Ddl_question3" onchange="onchange3()">

<option value="0">请选择密保信息</option>

<option value="1">您母亲的姓名是?</option>

<option value="2">您父亲的姓名是?</option>

<option value="3">您配偶的姓名是?</option>

<option value="4">您的出生地是?</option>

<option value="5">您高中班主任的姓名是?</option>

<option value="6">您初中班主任的姓名是?</option>

<option value="7">您小学班主任的姓名是?</option>

<option value="8">您小学校名是?</option>

<option value="9">您的学号(或工号)是?</option>

<option value="10">您父亲的生日是?</option>

<option value="11">您母亲的生日是?</option>

<option value="12">您配偶的生日是?</option>

</select>

【dropdownlist之间的互相联动实现(显示与隐藏)】相关文章:

日历-指定日期的新闻

JavaScript的9种继承实现方式归纳

JS实现浏览器菜单命令

javascript改变和控制显示的图片大小

javascript制作的滑动图片菜单

在ASP.NET MVC项目中使用RequireJS库的用法示例

JavaScript生成福利彩票双色球号码

Js的Array数组对象详解

JavaScript数据结构与算法之集合(Set)

表单的一些基本用法与技巧

精品推荐
分类导航