• event.srcElement获得引发事件的控件(表单)


    <1>

    <!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>
        <title></title>
        <script type="text/javascript">
            function getInput() {
                var inputs = document.getElementsByTagName("input"); //取得全部的input表单
                for (var i = 0; i < inputs.length; i++) {  //遍历全部的input表单
                    var inputName = inputs[i];  //获得当前遍历到的input表单
    
                    inputName.value = "哈哈"; //将当前的input表单value属性赋值“哈哈”
                    inputName.onclick = btnClick; //给遍历到的当前表单注冊onclick事件,事件的处理函数为btnClick 
                    //注意我这里仅仅是给inputName的onclick事件指定了一个处理函数btnClick,详细函数怎样定义,则会写在下面btnClick()函数中           
                }
            }
    
    
            //vet是一个对象(事实上就是event,名字能够随便起)如今我将它作为一个參数来传递,它就是指控件触发的事件的状态,既然他是一个对象,它肯定有一些属性的,当中就包括了srcElement,或者火狐中的target,还有些onclick等事件
            function btnClick(evt) {
                var inputs = document.getElementsByTagName("input");
                for (var i = 0; i < inputs.length; i++) {
                    var inputName = inputs[i];
    
                    //在IE 中srcElement 表示产生事件的源,比方是哪个按钮触发的onclick 事件,火狐中则是target。
                    //window.event.srcElement取得引发onclick事件的控件(表单元素)。在火狐中srcElement无效(要用target)
    
                    var obj = evt.srcElement ? evt.srcElement : evt.target;
    
                    if (inputName == theEvent.target) { //假设当前表单就是引发事件的控件,就将当前表单的value值设为“我被点击了”,否则设为“哈哈”
                        inputName.value = "我被点击了";
                    }
                    else {
                        inputName.value = "哈哈";
                    }
                }
            }
        </script>
    </head>
    <!--在页面载入完成后就会触发onload事件,onload事件就会调用getInput()函数,从而给全部的input表单的value赋值为“哈哈”-->
    <body onload="getInput()">
        <form>
        <input type="button" />
        <input type="button" />
        <input type="button" />
        <input type="button" />
        </form>
    </body>
    </html>
    

    http://blog.csdn.net/cyxlzzs/article/details/6711924


    简写

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title></title>
        <script src="Jquery/jquery-1.10.2.js" type="text/javascript"></script>
        <script type="text/javascript">
            function getInput() {
                var inputs = document.getElementsByTagName("input");
                for (var i = 0; i < inputs.length; i++) {
                    inputs[i].value = "哈哈";
                    inputs[i].onclick = function (evt) {
                        var inputs = $("input"); //等同于document.getElementsByTagName("input");
                        for (var i = 0; i < inputs.length; i++) {
                            if (inputs[i] == evt.target) { //注意==号,别写成了=
                                inputs[i].value = "我被点击了";
                            }
                            else {
                                inputs[i].value = "哈哈";
                            }
                        }
                    };
                }                            
            }       
        </script>
    </head>
    <body onload="getInput()">
    <input type="button" />
    <input type="button" />
    <input type="button" />
    </body>
    </html>


  • 相关阅读:
    变形方块
    Vim编辑器设置字体高亮显示
    从命令行终端获取数值作为函数参数
    Vi编辑器的使用技巧
    iOS开发常用shell命令
    include使用技巧
    交换2个整型变量的值
    C语言位运算实现函数体
    React Native 之文件内数据操作(var、let、const、static、Props、State、this)
    React Native 城市选择(四)获取城市名称
  • 原文地址:https://www.cnblogs.com/blfshiye/p/4297039.html
Copyright © 2020-2023  润新知