JavaScript——事件

来源:互联网 发布:淘宝店铺如何取消分流 编辑:程序博客网 时间:2024/06/05 17:46

事件:是由访问Web页面的用户引起一系列操作。

键盘事件

HTML事件

鼠标事件

事件的作用:用于浏览器和用户的交互


以下代码为相关试验代码:

HTML事件:

<script type="text/javascript">    window.onload = function(){        //获取元素        var a = document.getElementById('a');        var b = document.getElementById('b');        //添加一个内容改变监听事件        a.oninput = function(){            //把a的文本输入框内容覆盖给b            b.innerText = a.value;        }        //兼容IE9以下版本        a.onpropertychange= function(){            //把a的文本输入框内容覆盖给b            b.innerText = a.value;        }    }</script><body><input type="text" id="a" value=""/><div id="b"></div></body>

键盘事件

<script type="text/javascript">   window.onload=function() {      window.onkeypress=function(e) {         //按键键码         if(e.charCode==103) {            alert('G健被点击')         }      }   }</script>

鼠标单击、双击事件

<script>    window.onload = function() {        function dbl(){            alert('按钮被双击');        }    var input = document.getElementById('b');    input.onclick = function() {        alert('按钮被点击');    }        var c = document.getElementById('c');      /*  c.ondblclick = function(){            alert('按钮被双击');*/            c.ondblclick = dbl;        }       }</script><body><input type="button" id="b" value="点击"/><input type="button" id="c" value="点击"/></body>
原创粉丝点击