第十一章 二级联动

一,其他事件

1.键盘事件

写法:

            onkeydown() 某个键盘按下   
            onkeyup()   某个键盘抬起       //这个一般配合键码值使用  如Enter的键码值是13

  <input type="text">  
    <script>
        var ipt = document.getElementsByTagName("input")[0];

        ipt.onkeydown = function(){
            console.log("大大")
        }
    </script>

onkeydown

2.失焦聚焦事件

             聚焦 focus( )
             失焦  onblur()

3. onchange() 改变

当内部的值放生改变的时候所触发的事件 失焦以后触发
如可以用在下拉框

4. oninput() 事件

用户输入时触发的事件 是实时触发
注意:用中文输入法会触发两次 因为汉字是2字节

5.onresize()事件

当页面整体大小发生改变的时候 所触发的事件

6. 粘贴板事件 cvx事件

oncopy()复制 onpaste() 粘贴事件 oncut剪切

7.窗口事件 onload

是当页面执行完毕之后 执行里面的事件

        window.onload = function(){事件 }

二,二级联动

 <!-- 通过value里面的 0 1 2 去找对应的数组  -->
    <select name="" id="">
        <option value="">--请选择--</option>
        <option value="0">--广东省--</option>
        <option value="1">--吉林省--</option>
        <option value="2">--辽宁省--</option>
    </select>
       
    <select name="" id="">
        <option value="">--请选择--</option>
    </select>
    <script>
  //首先考虑创建节点和添加节点  
        //需要把对应省份的区写在一个二维数组里面   onchange事件 

        var arr = [
            ["广东市","佛山市","深圳市"],
            ["长春市","公主岭市"],
            ["铁岭市","沈阳市","大连市"]
        ];

        var one = document.getElementsByTagName("select")[0];
        var two = document.getElementsByTagName("select")[1];

        one.onchange = function(){
            console.log(this.value);
            //保证第二个选择框不重复 清空之前的内容 只保留一个请选择 
            two.length = 1;

            for(var i = 0;i<arr[this.value].length;i++){
                var op = document.createElement("option");
                op.innerHTML = "--"+ arr[this.value][i]+"--";
                two.appendChild(op);

            }
        }
    </script>

二级联动

三,数组的几种定义方式

     1.var arr = new Array();
    arr[0] = 1;   这样去添加值  

    2.var arr = new Array(8)  括号里面是长度 
    然后正常去添加值   但是超出长度也没事   

    3.var arr = new Array("1","2","3");    

    4.var arr = [1,2,3,4,5]

8push() 在数组的末尾去添加数据
写法::arr.push("阿达")
可以同时添加多个

---