JavaScript中点击事件的写法

<button id="btn">click</button>
var btn=document.getElementById('btn');

第一种：

btn.onclick=function(){
alert('hello world');
}

消除事件：btn.onclick=null;//就不会弹出框了

第二种：

btn.addEventListener('click',function(){alert('hello world')},false);
btn.addEventListener('click',function(){alert(this.id)},false);

第三种：

function demo(){

　　alert('hello');
}
<button id="btn" onclick="demo()">click</button>

下面给大家介绍js触发按钮点击事件

模拟JS触发按钮点击功能

<html>
  <head>
    <title>usually function</title>
  </head>
  <script>
function load(){
  //下面两种方法效果是一样的
  document.getElementById("target").onclick();
  document.getElementById("target").click();
}
function test(){
  alert("test");
}
</script>
  <body onload="load()">
    <button id="target" onclick="test()">test</button>
  </body>
<html>

 备注：

btnObj.click()是真正地用程序去点击按钮，触发了按钮的onclick（）事件

btnObj.onclick()只是简单地调用了btnObj的onclick所指向的方法，只是调用方法而已，并未触发事件

赞 (0)

相关推荐

  • JavaScript事件方法(实例讲解)

    废话不多说,直接上代码 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <style type="text

  • JavaScript每天必学之事件

    JavaScript每天必学之事件

    其实这篇文章挺早之前就写了,但是由于sf保存方面的bug,所以当时写了一大堆,结果没保存,觉得这个没写完是个不小的遗憾,今天正好有空,就给补充下了,也正好给我的javascript学习总结做一个完结篇. 这里,主要讨论一下js相关的事件-- 事件处理程序 在DOM中定义了一些事件, 而响应某个事件的函数就叫事件处理程序(或事件侦听器).事件处理程序的名字一般以"on"开头,例如:onclick等 事件冒泡与捕获 事件流指的是页面中接收事件的顺序,IE,火狐和chrome浏览器都是事件冒

  • JavaScript事件处理的方式(三种)

    JavaScript事件处理的方式(三种)

    最近这段时间因为每天要修改网站,为网站做特效,所以看了很多的js接触事件,自己只会使用一小部分,有时用的时候也比较混乱,现在系统的整理了一下,特此分享到我们平台供大家参考下! 一.什么是JavaScript事件? 事件(Event)是JavaScript应用跳动的心脏,也是把所有东西粘在一起的胶水,当我们与浏览器中Web页面进行某些类型的交互时,事件就发生了. 事件可能是用户在某些内容上的点击.鼠标经过某个特定元素或按下键盘上的某些按键,事件还可能是Web浏览器中发生的事情,比如说某个Web页面

  • 关于JavaScript中事件绑定的方法总结

    最近收集了一些关于JavaScript绑定事件的方法,汇总了一下,不全面,但是,希望便于以后自己查看. JavaScript中绑定事件的方法主要有三种: 1 在DOM元素中直接绑定 2 JavaScript代码中直接绑定 3 绑定事件监听函数 一.在DOM元素中直接绑定 也就是直接在html标签中通过 onXXX="" 来绑定.举个例子: <input type="button" value="点我呦" onclick="aler

  • 详解javascript事件绑定使用方法

    由于html是从上至下加载的,通常我们如果在head部分引入javascript文件,那么我们都会在javascript的开头添加window.onload事件,防止在文档问加载完成时进行DOM操作所出现的错误.如果有多个javascript文件,那么极有可能出现多个window.onload事件,但是最后起作用的只有一个,这时候就需要使用事件绑定来解决这个问题了. IE方式 attachEvent(事件名称, 函数),绑定事件处理函数 detachEvent(事件名称, 函数),解除绑定 DO

  • JavaScript中点击事件的写法

    <button id="btn">click</button> var btn=document.getElementById('btn'); 第一种: btn.onclick=function(){ alert('hello world'); } 消除事件:btn.onclick=null;//就不会弹出框了 第二种: btn.addEventListener('click',function(){alert('hello world')},false); b

  • Android中点击事件的四种写法详解

    Android中点击事件的四种写法详解

    Android中点击事件的四种写法 使用内部类实现点击事件 使用匿名内部类实现点击事件 让MainActivity实现View.OnClickListener接口 通过布局文件中控件的属性 第一种方法:使用内部类 基本步骤如下: 1. 新建一个MyOnClickListener类并实现View.OnClickListener接口 2. 重写View.OnClickListener接口中的OnClick(View view)方法 3. 给Button绑定一个监听器,并监听一个点击事件 示例代码如下

  • 详解Android中点击事件的几种实现方式

    在之前博文中多次使用了点击事件的处理实现,有朋友就问了,发现了很多按钮的点击实现,但有很多博文中使用的实现方式有都不一样,到底是怎么回事.今天我们就汇总一下点击事件的实现方式. 点击事件的实现大致分为以下三种: (1)Activity 实现接口方式实现点击事件(经常使用) (2)自定义方法,使用配置文件android:onclick (3)使用内部类方式实现 (4)使用匿名内部类实现介绍下几种点击事件的实现方式: 下面我们通过代码来简单演示下几种点击事件的实现方式: (1)Activity 实现

  • IE8的JavaScript点击事件(onclick)不兼容的解决方法

    博客园闪存分页是用JavaScript生成的,今天发现在IE8下点击页码不能翻页,翻页操作是在当前页码的onclick事件中进行的. 开始代码是这么写的: 复制代码 代码如下: var a = document.createElement("a");a.setAttribute("onclick", this.ClickFunctionName + "(" + pageIndex + ");Pager.SetCurrent("

  • 用Kotlin实现Android点击事件的方法

    近期,Google宣布Kotlin成为了Android一级开发语言.于是就刚刚简单的研究了一下,查资料的时候发现现成的资料还是很少的,于是决定自己记录一下,方便以后查看,也供其他人一个参考. 在android中,点击事件大致分为三种写法: 1. 匿名内部类. 2. Activity实现全局OnClickListener接口. 3. 指定xml的onClick属性. 今天用Kotlin实现这三种方式实现点击事件 匿名内部类:这种方式最简单 override fun onCreate(savedIn

  • Android捕获点击事件范围的方法

    View的Tween动画过程中点击事件的位置并不会因为动画位置的改变而改变,是因为在动画过程中layout的位置实际上没有变,因此曾经一度认为View的点击事件(其实不仅仅是点击事件,包括所有的触摸事件)触发的范围是该View在layout的时候指定的left,top,right,bottom.今天才发现不完全是这样的.一切都是因为平时看代码没有仔细一点所造成了对问题理解不全面. 在这里记录一下发现问题到处理问题的过程. 自定义这样一个ViewGroup,layout两个线性布局,左边的Line

  • IOS setOnclick点击事件分析

    在Android中点击事件是以setOnclick的形式进行设置的,用起来十分方便,而在ios中是以addTarget方式进行的,每次设置点击事件都需要声明一个新的方法,在大部分情况下显得未免有些麻烦.而且通常来说我们使用的最多的是TouchUpInside方式的点击事件,所以为了方便使用,我对UIButton/UIView的点击事件进行了扩展. 使用 和之前一样,我们先来看看扩展之后如何使用 oc版本 [_btn1 setOnclick:^{ NSLog(@"click btn1")

  • 解决vue 绑定对象内点击事件失效问题

    突然的发现某段 html 代码中点击事件失效了. 仔细观察才发现,这段代码内的元素都在 vue 绑定对象中. 因此失效. 解决办法是将绑定对象内的元素点击事件换成 v-on:click. 以上这篇解决vue 绑定对象内点击事件失效问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们.

  • JavaScript给每一个li节点绑定点击事件的实现方法

     1.单击事件 <body> <h2>javascript 事件</h2> <ul> <li>aaaa</li> <li>aaaa111</li> <li>aaaa222</li> <li>aaaa3333</li> <li>aaaa444</li> </ul> <script type="text/javasc

  • JavaScript给按钮绑定点击事件（onclick）的方法

    本文实例讲述了JavaScript给按钮绑定点击事件(onclick)的方法.分享给大家供大家参考.具体分析如下: 我们可以通过设定按钮的onclick属性来给按钮绑定onclick事件 <!DOCTYPE html> <html> <head> <script> function displayDate() { document.getElementById("demo").innerHTML=Date(); } </script

随机推荐