zoukankan html css js c++ java

JavaScript——事件

事件：是由访问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>

查看全文

相关阅读:
html5 悬浮提示框
 ajax 接收json
ajax 发送参数
 jquery无刷新请求ajax
jQuery 发送 ajax json 请求
 html5 三级联动菜单
 iframe 用法
 html5 复制文字
 bootstrap表单按回车会自动刷新页面的问题
 jquery版本不兼容问题

原文地址：https://www.cnblogs.com/aixing/p/13327763.html