js中的点击事件（click）的实现方式
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>js中的点击事件（click）的实现方式</title>
</head>
<body>
<!-- 第三种方式-->
<button id="btn" onclick="threeFn()">点我</button> <script type="text/javascript">
var btn = document.getElementById("btn"); // 第一种 通过点击事件
btn.onclick = function(){
alert("这是第一种点击方式");
} // 第二种 监听点击事件
btn.addEventListener('click', function(){
alert("这是第二中点击方式");
}) // 第三种 通过方法响应点击事件
function threeFn(){
alert("这是第三种点击方式");
}
</script>
</body>
</html>
js中的点击事件（click）的实现方式的更多相关文章
- bootstrap table 生成的表格里动态添加HTML元素按钮，JS中添加点击事件，点击没反应---解决办法
bootstraptable中onExpandRow属性---js 方法添加的 html代码,然后给这代码里面的 元素 添加 事件,却获取不该元素.(称之为未来元素),由于是未来的 所以现在没有这个 ...
- vue中Enter触发登录事件和javascript中Enter触发点击事件
created(){ window.addEventListener('keydown', this.handleKeyDown, true)//开启监听键盘按下事件 } 在methods中当keyC ...
- js触发按钮点击事件
js触发按钮点击事件 博客分类: javascript 模拟JS触发按钮点击功能 <html> <head> <title>usually function&l ...
- qtp不识别树结构中的点击事件
qtp不识别树结构中的点击事件,未生成该点击事件的脚本,解决办法: 1.未生成点击"auto分类c1"的脚本 2.点击1.对象库-2.添加对象库-3.选中对象-点击OK,即将该对象 ...
- 关于在"a"标签中添加点击事件的一些问题
昨天做修改页面跳转时遇到一个问题,如果a标签的"href"属性为空的话,比如这样<a href="" onclick="roleupdate() ...
- jquery中交替点击事件toggle方法的使用示例
jquery中交替点击事件toggle方法中有两个参数,分别是要交替执行的事件.如果不传参默认是显示隐藏功能,下面有个不错的示例,感兴趣的朋友可以参考下 复制代码代码如下: $('#clickId‘) ...
- js input radio点击事件
html代码: <input type="radio" name="myname" value="1" />1 <inpu ...
- android点击事件的四种方式
android点击事件的四种方式 第一种方式:创建内部类实现点击事件 代码如下: package com.example.dail; import android.text.TextUtils; im ...
- js for循环中点击事件中无法获取每一个i值的问题
好像是第二次遇到这个问题,必须要总结一下!! <!DOCTYPE html> <html> <head> <meta charset="utf-8& ...
随机推荐
- 关于java登录界面
import java.awt.*; 包含用于创建用户界面和绘制图形图像的所有类. import javax.swing.*; 提供一组“轻量级”(全部是 Java 语言)组件,尽量让这些组件在所 ...
- Shell编程之Expect自动化交互程序
一.Expect自动化交互程序 1.spawn命令 通过spawn执行一个命令或程序,之后所有的Expect操作都会在这个执行过的命令或程序进程中进行,包括自动交互功能. 语法: spawn [ 选项 ...
- springmvc中url-url-pattern /和/*的区别
在使用springmvc时,都会在web.xml中配置一个dispatchservlet,如下: <listener> <listener-class> org.springf ...
- shell删除最后一列、删除第一行、比较文件
删除文件第一行: sed -i '1d' filename 删除文件最后一列: awk '{print $NF}' filename 比较文件的方法: 1)comm -3 --nocheck-orde ...
- python进阶01
基础部分python学完,咱们可以深入了解下python高阶知识点,让我们一起来学习吧! 1.面向对象进阶 1)元类 1.1.1:python创建类原理 python创建类: class Object ...
- MySQL操作的相关命令
拷贝表,并且复制两条数据到新表中 create table t_comments_sample2 like t_comments_sample; #拷贝表结构 ,;#复制两条数据 MySQL Work ...
- Solr新建collection时报错 Caused by: Direct buffer memory
错误如下 [root@192.168.1.235 conf]# curl "http://192.168.1.235:8983/solr/admin/collections ?action= ...
- 分布式技术 memcached
memcached 是一个高性能的分布式内存对象缓存系统,用于动态web应用,以减轻数据库负载,它通过在内存中缓存数据和对象来减少读取数据库的次数,从而提高动态.数据库驱动网站的速度.memcache ...
- Keystone Federation Identity
转自 http://wsfdl.com/openstack/2016/01/14/Keystone-Federation-Identity.html Keystone federation ident ...
- JavaScrip 原生多文件上传及预览 兼容多浏览器
JavaScrip 原生多文件上传及预览 兼容多浏览器 html代码块 <div class="container"> <label>请选择一个图像文件:& ...