Java教程

Javascript中点击(click)事件的三种写法举例

本文主要是介绍Javascript中点击(click)事件的三种写法举例，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

在JavaScript中Click事件是一种常见的用户交互事件,表示用户在网页上点击某个元素的动作,这篇文章主要给大家介绍了关于Javascript中点击(click)事件的三种写法,需要的朋友可以参考下


目录

  • 方法一：

  • 方法二：

  • 方法三：

  • 附：js连续指定两次或者多次的click事件（解决办法）

  • 总结 

方法一：

<!DOCTYPE html>
<html>
<head>
    <title>Javascript中点击事件方法一</title>
</head>
<body>
    <button id="btn">click</button>
    <script type="text/javascript">
        var btn = document.getElementById("btn");
        btn.οnclick=function(){
            alert("hello world");
        }
    </script>
</body>
</html>

消除事件：btn.οnclick=null;

方法二：

<!DOCTYPE html>
<html>
<head>
    <title>Javascript中点击事件方法二</title>
</head>
<body>
    <button id="btn">click</button>
    <script type="text/javascript">
        var btn = document.getElementById("btn");
        btn.addEventListener('click',function(){
            alert("hello wrold");
        },false)
    </script>
</body>
</html>


方法三：

<!DOCTYPE html>
<html>
<head>
    <title>Javascript中点击事件方法三</title>
    <script type="text/javascript">
        function test(){
            alert("hello world");
        }
    </script>
</head>
<body>
    <button id="btn" οnclick="test()">click</button>
</body>
</html>

附：js连续指定两次或者多次的click事件（解决办法）

setTimeout (表达式,延时时间)

setTimeout(表达式,交互时间)

延时时间/交互时间是以豪秒为单位的(1000ms=1s)

setTimeout  在执行时,是在载入后延迟指定时间后,去执行一次表达式,仅执行一次

setTimeout 在执行时,它从载入后,每隔指定的时间就执行一次表达式

if(ischoose == false){
                ischoose = true;
                document.getElementById("myBaby").click();
       } else {
                document.getElementById("myBaby").click();//奇数次单击和偶数次单击不同的效果!
                setTimeout(function(){document.getElementById("myBaby").click();},50);
       }


这篇关于Javascript中点击(click)事件的三种写法举例的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！
您可能喜欢
栏目导航