javascript select 之间传值效果的代码

二个框内值传递.不错的效果

代码如下:

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

function $(value) 

 return document.getElementById(value); 

function ch(s){ 
 var p = new Array(0,1,2); 
 p[0] = '大学'; 
 p[1] = '高中'; 
 p[2] = '初中'; 
 if(s.value=='0'){ 
  $('n2').options.length = 0; 
  $('n2').options.add(new Option(p[0],p[0])); 
 } 
 if(s.value=='1'){ 
  $('n2').options.length = 0; 
  $('n2').options.add(new Option(p[1],p[1])); 
 } 
 if(s.value=='2'){ 
  $('n2').options.length = 0; 
  $('n2').options.add(new Option(p[2],p[2])); 
 } 

</script> 
<table width="400" border="0" align="center" cellpadding="0" cellspacing="0"> 
  <tr> 
    <td width="119"><select name="n1" size="10" id="n1" onchange="ch(this)"> 
      <option value="0">大学</option> 
      <option value="1">高中</option> 
      <option value="2">初中</option> 
    </select> 
    </td> 
    <td width="281"><select name="n2" size="10" id="n2"><option value="a">a</option> 
        </select></td> 
  </tr> 
</table>

function $(value)
{
return document.getElementById(value);
}
function ch(s){
var p = new Array(0,1,2);
p[0] = '大学';
p[1] = '高中';
p[2] = '初中';
if(s.value=='0'){
$('n2').options.length = 0;
$('n2').options.add(new Option(p[0],p[0]));
}
if(s.value=='1'){
$('n2').options.length = 0;
$('n2').options.add(new Option(p[1],p[1]));
}
if(s.value=='2'){
$('n2').options.length = 0;
$('n2').options.add(new Option(p[2],p[2]));
}
}

大学
高中
初中

a

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

(0)

相关推荐

  • javascript select 之间传值效果的代码

    二个框内值传递.不错的效果 复制代码 代码如下: <script type="text/javascript" defer="defer"> function $(value)  {   return document.getElementById(value);  }  function ch(s){   var p = new Array(0,1,2);   p[0] = '大学';   p[1] = '高中';   p[2] = '初中';   i

  • JavaScript 浮动定位提示效果实现代码第1/2页

    这个效果本身难度不大,主要在程序结构和扩展中下了些功夫,务求用起来更方便,能用在更多的地方.程序特点 1,同一个提示框用在多个触发元素时,只需一个实例: 2,显示和隐藏分别有点击方式和触发方式选择: 3,能设置延时显示和隐藏: 4,有25种预设定位位置: 5,可在预设定位基础上,再自定义定位: 6,可设置自适应窗口定位: 程序说明 [Tip对象] Tip对象就是用来显示提示信息的容器,程序用Tip属性表示.这个没什么要求,程序初始化时会对它进行一些设置. 首先进行下面设置: 复制代码 代码如下:

  • 利用JavaScript实现新闻滚动效果(实例代码)

    最近要实现一个滚动新闻效果,在网上查了一些资料,发现基本的实现方法有两种: 1.使用Marquee标签.这个标签的使用我已经转载了一篇比较详细的文章,这个标签的优点是便于使用,缺点是人们已经逐渐不适用它了,许多浏览器不支持,甚至在IE8想,XHTML4.0的loose.dtd是可以的,而去掉loose.dtd却不行. 2.使用div+javascript的方法.这种方法的好处是可以兼容几乎所有的浏览器,并且在可以预料的时间内仍能稳定运行.并且使用div使得网页可以利用现有的css资源实现很多炫目

  • jQuery对象和Javascript对象之间转换的实例代码

    复制代码 代码如下: 以下是本人的一些分享,我热爱编程,希望能多交编程的爱好者,如果你也是其中一名,那么请加好友,大家关注一下,下面的文章是自己觉得一些有用的东西,留下来给自己当笔记,当然也希望能帮助到你,首先感谢你的阅读~! 如果我们在用jQuery作为客户端页面的脚本,时常都会涉及到jQuery对象和Javascript对象的相互转换.因为,DOM对象就是Javascript 固有的一些对象操作.DOM 对象能使用Javascript 固有的方法,但是不能使用 jQuery 里的方法.所以,

  • JavaScript:Div层拖动效果实例代码

    Div层拖动效果图: 实现:CSS: 复制代码 代码如下: <style>div{position:relative;}</style> JS: 复制代码 代码如下: <script type="text/javascript"> var mouseover=truevar xcoor;var ycoor;function coordinates(){ if (event.srcElement.id.indexOf("wishbroad&q

  • javascript 通用loading动画效果实例代码

    由于项目中多处要给ajax提交的时候增加等待动画效果,所以就写了一个简单的通用js方法:代码如下: 复制代码 代码如下: /*ajax提交的延时等待效果*/ var AjaxLoding = new Object(); //wraperid : 显示loding图片的容器元素//ms:表示loding图标显示的时长,毫秒//envent:表示出发事件的事件源对象,用于获得出发事件的对象//callback:表示动画结束后执行的回掉方法//stop()方法表示在回掉方法执行成功后执行的隐藏动画的操

  • javascript之textarea打字机效果提示代码推荐

    比较不错的应用 function $(id){return document.getElementById(id);} var msgall="一个专业的收藏精品脚本学习资料的网站,修正错误,努力打造精品脚本学习站,我们将会为大家附上游戏脚本资源,源码,软件等信息" var msg = "输入问题内容,点击"我要提问"." ; var interval = 100 var spacelen = 100; var space10=" &q

  • 用javascript实现旋转图片效果的代码

    旋转图片 '); document.write(' '); for (n=0; n '); document.write(' '); document.write(' '); function FollowMouse(){ Xpos = document.body.scrollLeft+event.x+UpDown; Ypos = document.body.scrollTop+event.y+LeftRight; } document.onmousemove = FollowMouse; }

  • javascript 缓冲效果实现代码 推荐

    菜鸟版代码如下: 理解这段代码就基本上掌握了 复制代码 代码如下: function f_s() { var obj = document.getElementById("top"); obj.style.display = "block"; obj.style.height = "1px"; var sw = function () { var s_width = parseInt(obj.style.height); if (s_width

  • javascript布局查看器效果代码

    body{ margin:0 auto; width:950px; font-size:12px; text-align:center; } #wholebody{ width:950px; } .newline{/*仅应用于右侧*/ clear:both; width:700px; } #top{ height:auto; } .left_square{ } .right_square{ } #topic{ height:100px; } #left{ float:left; width:25

随机推荐