zoukankan html css js c++ java

JS学习记录（事件）

鼠标事件
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>鼠标事件</title>
</head>
<body>
<button onclick="myClick()">鼠标单击</button>
<button ondblclick="myDBClick()">鼠标双击</button>
<button onmousedown="myMouseDown()" onmouseup="myMouseUp()">鼠标按下和抬起</button>
<button onmouseover="myMouseOver()" onmouseout="myMouseOut()">鼠标悬浮和离开</button>
<button onmousemove="myMouseMove()">鼠标移动</button>
<button onmouseenter="myMouseEnter()" onmouseleave="myMouseLeave()">鼠标进入和离开</button>
</body>
<script>
    function myClick() {
        console.log("你单击了按钮！");
    }
    function myDBClick() {

        console.log("你双击了按钮！");
    }
    function myMouseDown() {
        console.log("鼠标按下了！");
    }
    function myMouseUp() {
        console.log("鼠标抬起了！");
    }
    function myMouseOver() {
        console.log("鼠标悬浮！");
    }
    function myMouseOut() {
        console.log("鼠标离开！")
    }
    function myMouseMove() {
        console.log("鼠标移动！")
    }
    function myMouseEnter() {
        console.log("鼠标进入！")
    }
    function myMouseLeave() {
        console.log("鼠标离开！")
    }

</script>
</html>

结果图：根据按钮得到相应效果

键盘事件
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>键盘事件</title>
</head>
<body>
<input id="name" type="text" onkeydown="myKeyDown(this.id)" onkeyup="myKeyUp(this.id)">
</body>
<script>
    /*输出输入的字符*/
    function myKeyDown(id) {
        console.log(document.getElementById(id).value);
    }
    /*按键结束，字体转换为大写*/
    function myKeyUp(id) {
        var text = document.getElementById(id).value;
        document.getElementById(id).value = text.toUpperCase();
    }
</script>
</html>

结果图：

查看全文

相关阅读:
DFS复习
 二叉搜索树专题
 二叉树路径问题
 二叉树LCA--leetcode236题
 二叉树创建与前、中、后序遍历
 leetCode--n数之和--哈希表/双指针
 leetCode--单词接龙--BFS
vue-router简单实现
 Promise的简单实现
 闭包&作用域链&let

原文地址：https://www.cnblogs.com/lizuowei/p/7301036.html