js的点击事件

忘是亡心i 2022-10-16 06:10 368阅读 0赞

<!DOCTYPE html>
    <html lang="en">
    
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
    </head>
    
    <body>
        <div>
            <button id="btn" onclick="threeFn()">按钮</button>
        </div>
    </body>
    
    </html>
    <script type="text/javascript">
        let btn = document.getElementById("btn");
    
        window.onload = function () { 
            // 第一种 通过点击事件
            btn.onclick = function () { 
                alert("这是第一种点击方式");
            }
    
            // 第二种 监听点击事件
            btn.addEventListener('click', function () { 
                alert("这是第二中点击方式");
            })
    
            // 第三种 通过方法响应点击事件
            function threeFn() { 
                alert("这是第三种点击方式");
            }
    
            // 第一种改进 通过点击事件
            myClick("btn", function () { 
                alert("点击成功")
            })
        }
    
        function myClick(idStr, fun) { 
            let btn = document.getElementById(idStr)
            btn.onclick = fun
        }
    </script>

发表评论取消回复

表情：

评论列表（有 0 条评论，368人围观）

还没有评论，来说两句吧...

相关阅读

相关 js定时点击事件实现

1）无限循环点击，20毫秒执行一次 setInterval(function()\{ $("\submit").click(); \}, 20); 2）定时点击2

Dear 丶/ 2024年02月19日 18:46/ 0 赞/ 192 阅读

相关 jquery点击事件(jquery触发点击事件onclick)

jquery实现远程http的get请求用哪个事件？jquery ![jquery点击事件][jquery] jquery实现远程http的get请求用哪个事件？jq

系统管理员/ 2023年09月26日 15:01/ 0 赞/ 314 阅读

相关 jq点击事件(jq点击事件)

用的HTML5里video标签，用jq怎么点击全屏之后自动横屏播? 可以自己设置的 ![jq点击事件(jq点击事件)\_jq点击事件(jq点击事件)][jq_jq_jq

末蓝、/ 2023年09月26日 14:48/ 0 赞/ 61 阅读

相关 js点击事件(Js点击事件冲突怎么办)

JS点击onclick事件这个是闭包的问题 for (var i = 12; i <= 16; i++) \{ (function(i)\{ 第12个点击事

末蓝、/ 2023年09月26日 14:47/ 0 赞/ 340 阅读

相关 js的点击事件

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8">

忘是亡心i/ 2022年10月16日 06:10/ 0 赞/ 369 阅读

相关 js按钮点击事件，调用方法

<html> <head> <title>usually function</title> </head> <scr

爱被打了一巴掌/ 2022年09月04日 03:45/ 0 赞/ 478 阅读

相关点击事件

javascript教程 function displayDate()\{ document.getElementById("demo").inner

朴灿烈づ我的快乐病毒、/ 2022年06月08日 02:07/ 0 赞/ 499 阅读

相关 js点击事件禁止冒泡

$(".car-style").click(function(){ $(".operate-mask-outer").show();

- 日理万妓/ 2022年04月15日 05:38/ 0 赞/ 525 阅读

相关 Charts.js 图例添加点击事件

<!DOCTYPE html> <html lang="en"> <head> <meta http-

短命女/ 2021年10月08日 05:44/ 0 赞/ 775 阅读

相关 JS 点击事件传参

<script type="text/javascript"> var list; var machineCode;

桃扇骨/ 2021年10月08日 05:42/ 0 赞/ 593 阅读