关于志愿者会员管理的一些肤浅技术!!!

1.使用js对页面上一些文字作修改:

如<span id="123">123</span>

要将123改为456;并且变颜色为红色:

js可以这样写:

 var p= document.getElementById("123");
   p.firstChild.nodeValue = 456;

document.getElementById("123").style.color = "red";

类似地,可以对123进行各种各样的属性修改,这些不在啰嗦。

 

2.下拉框联动的制作,下面这个完全本人制作,属于正版:

例如:有1、2、3、4这4个选项;选其中一项就要在下一层下来框中出现对应的option;

1之后出现11、12、13、14、15、16

2之后出现21、22、23、24、25、26

3之后出现31、32、33、34、35、36

4之后出现41、42、43、44、45、46

代码如下:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>无标题页</title>
</head>

 <script language="javascript" type="text/javascript">
     function check() {
         var index = document.getElementById("1").selectedIndex;
         if (index == 1) {
             var option = document.getElementById("2");
             option[0] = new Option("请选择");
             option[1] = new Option(11);
             option[2] = new Option(12);
             option[3] = new Option(13);
             option[4] = new Option(14);
             option[5] = new Option(15);
             option[6] = new Option(16);
             
         }
         if (index == 2) {
             var option = document.getElementById("2");
             option[0] = new Option("请选择");
             option[1] = new Option(21);
             option[2] = new Option(22);
             option[3] = new Option(23);
             option[4] = new Option(24);
             option[5] = new Option(25);
             option[6] = new Option(26);
         }
         if (index == 3) {
             var option = document.getElementById("2");
             option[0] = new Option("请选择");
             option[1] = new Option(31);
             option[2] = new Option(32);
             option[3] = new Option(33);
             option[4] = new Option(34);
             option[5] = new Option(35);
             option[6] = new Option(36);
         }
         if (index == 4) {
             var option = document.getElementById("2");
             option[0] = new Option("请选择");
             option[1] = new Option(41);
             option[2] = new Option(42);
             option[3] = new Option(43);
             option[4] = new Option(44);
             option[5] = new Option(45);
             option[6] = new Option(46);
         }

      
     }
    
    
    
    
    
    
    

</script>

 

<body>

 

 

<select id="1"  onchange="check();">
<option >请选择</option>
<option >1</option>
<option >2</option>
<option >3</option>
<option >4</option>
</select>


<select id="2" >
<option>请选择</option>
</select>


<select id="3" >
<option>请选择</option>
</select>

 

</body>
</html>

注意:var index = document.getElementById("1").selectedIndex;这个是返回被选择的那一个option的位置。

new option()是新建option的方法。

这种制作联动下拉框的方法比较古板,不过很实用(option比较少时);对于option比较多的时候不建议采用,星期六本人会分析另一种做法,其实原理是一个死样。

动态下拉框联动就是多了一个读数据库的过程,有兴趣的同学自己研究一下。

 

留点下一次写,欢迎评论。有不对的地方直接踩,觉得肤浅的就多踩几下,谢谢!!!

 

 谢学明

posted on 2010-09-17 18:23  gdutlab624  阅读(165)  评论(1编辑  收藏  举报

导航