Javascript中点击(click)事件的三种写法举例
更新时间：2024年06月08日 09:44:15 作者：左手喵子
在JavaScript中Click事件是一种常见的用户交互事件,表示用户在网页上点击某个元素的动作,这篇文章主要给大家介绍了关于Javascript中点击(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)事件的三种写法的文章就介绍到这了,更多相关js点击(click)事件写法内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
Javascript中replace方法与正则表达式的结合使用教程
replace方法是javascript涉及到正则表达式中较为复杂的一个方法,严格上说应该是string对象的方法,下面这篇文章主要给大家介绍了关于Javascript中replace方法与正则表达式的结合使用的相关资料,需要的朋友可以参考下2022-09-09
这篇文章主要介绍了js+html5实现canvas绘制圆形图案的方法,涉及html5图形绘制的基础技巧,需要的朋友可以参考下2015-06-06
这篇文章主要介绍了JS中==、===你分清楚了吗,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-03-03
对象，是javascript中非常重要的一个梗，是否能透彻的理解它直接关系到你对整个javascript体系的基础理解，说白了，javascript就是一群对象在搅。。（哔！）。2014-09-09
这篇文章主要介绍了JavaScript定义函数的相关资料,需要的朋友可以参考下2017-06-06
这篇文章主要介绍了JavaScript获取页面上被选中文字的方法技巧,本文直接给出实现代码和运行效果,需要的朋友可以参考下2015-03-03
这篇文章主要介绍了JavaScript实现的双向跨域插件分享,本文实现把整个跨域过程抽象出来,封装成一个JavaScript插件,需要的朋友可以参考下2015-01-01
这篇文章主要介绍了JS高阶函数原理与用法,结合实例形式分析了javascript函数式编程、一等函数、高阶函数等相关概念、原理及使用技巧,需要的朋友可以参考下2019-01-01
本文给大家介绍js事件详解，涉及到事件流，事件处理，事件对象等方面的知识，非常不错，具有参考借鉴价值，感兴趣的朋友一起学习吧2016-06-06
单例模式也称作为单子模式，更多的也叫做单体模式。为软件设计中较为简单但是最为常用的一种设计模式。这篇文章主要介绍了Javascript实现单例模式的相关资料,需要的朋友可以参考下2016-01-01
最新评论