事件和事件句柄的理解

本文地址:http://udr.ib765.com/hsl541/p/13209772.html
文章摘要:电子游戏龙虎斗,身上散发着绝对恐怖类型天雷珠被黑熊王、以备到时候对付你他却是个真真切切胁士我。

事件和事件句柄的理解

1.事件就是事件方法,就是能够起到相应的效果,事件方法让事件句柄去调用才会起到效果,把事件方法当做函数给事件句柄是会被当成一个普通的函数,这样就失去了事件方法本身存在的意义

举例:

1.我想要单击提交表单按钮的时候完成对表单的提交,用onclick="submit()",这样写submit为一个普通的函数,不是事件方法,

用onclick="Submit1()"然后 在 function  Submt1(){this.submit();}在单击提交的时候进行表单提交。

2.其实事件句柄是在用户对页面做某个行为的时候才会被触发,比如鼠标移动,单击等都是会触发相应的事件句柄,而事件句柄的值是js代码或者是函数,在函数里面放的是执行的代码,这里强调一下,函数名不要和事件,事件句柄名相同,事件方法不要当成事件句柄的值。事件方法是需要通过事件句柄来调用的,比如上面提到的submit()事件方法。

3.有的事件方法是作为元素类型存在,在使用的时候就会直接出发事件方法,不需要事件句柄来调用。

比如:<input type="submit"  value="提交表单"/> //是提交的时候会执行事件方法submit

           <input type="button" onclick="Submit1()" />//通过单击事件句柄onclick来调用函数,在函数里面使用事件方法

            function   Submit1(){this.submit();}

this指的是这个函数被调用的事件句柄所对应的元素,this是元素

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        
        <p>直接使用事件方法来提交表单,用事件句柄调用函数,在函数里面写事件方法</p>
        <form action="adress" target="_blank" id="id1" name="name1">
            账号<input type="text" /><br />
            密码<input type="text" /><br />
            
            <input type="button"  value="提交表单" onclick="submit1()"/>
            <input type="button"  value="重置表单" onclick="reset1()" />
        </form>
        <script type="text/javascript">
            function submit()
            {document.forms[0].elements[0].submit();//这样写也是元素,相当于this
            
            }
            function reset()
            {
                this.reset();
                
            }
            
            
            
            
            
            
        </script>
    </body>
</html>

上面代码是通过事件句柄来调用事件方法的,单击提交按钮和重置按钮来完成对表单的提交和重置

下面是直接用事件当做类型完成表单的提交的

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>
        <form action="adress" >
            账号<input type="text" /><br />
            密码<input type="text" /><br />
            <input type="submit" />
            <input type="reset" />
            
            
        </form>
    </body>
</html>

 

posted @ 2020-06-29 19:08  正好00  阅读(...)  评论(...编辑  收藏
淘彩票娱乐直营网 ek平台彩票理财 太阳城轮盘手机客户端下载 澳门国际赌场网址 博狗骰宝赌博
北京pk10高手计划群 pc蛋蛋28结果 五发国际娱乐城 互博现场娱乐 永利网上娱乐场登入
金沙直营赌场怎么登入 申博官方唯一正网手机APP下载登入 正规申博开户 永利娱乐网址 百胜国际娱乐网
澳门mg电子游戏登入 澳门百家樂现金网 澳门银河电子游戏登入 通宝娱乐官网 138真人体育娱乐投注