JavaScript判断按钮被点击的方法

 更新时间:2015年12月13日 14:04:39   作者:深海的小鱼儿  
javascript代码判断按钮是否被点击了在项目中经常会遇到这个需求,今天小编抽点时间给大家分享一段代码关于javascript判断按钮是否被点击的方法,感兴趣的朋友一起学习吧

废话不多说了,直接给大家贴代码了。

firfox版:

<HTML> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<HEAD> 
<TITLE></TITLE> 
<script> 
document.onclick=function(e){ 
var evt=e||window.event; 
var tar=evt.target||evt.srcElement; 
if( (tar.tagName.toLowerCase()=="input"&&tar.type=="button") || tar.tagName.toLowerCase()=="button"){ 
alert("你点击的是一个按钮") 
} 
} 
</script> 
</HEAD> 
<BODY> 
<input id="button1" type="button" value="1111"/> 
<input id="button2" type="button" value="2222"/> 
<input id="button3" type="button" value="3333"/> 
<input id="button4" type="button" value="4444"/> 
</BODY> 
</HTML> 
google 浏览器版:
<HTML> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<HEAD> 
<TITLE></TITLE> 
<script> 
document.onclick=function()
{ var obj = event.srcElement; 
if(obj.type == "button"){ 
alert(obj.id); } 
} 
</script> 
</HEAD> 
<BODY> 
<input id="button1" type="button" value="1111"/> 
<input id="button2" type="button" value="2222"/> 
<input id="button3" type="button" value="3333"/> 
<input id="button4" type="button" value="4444"/> 
</BODY> 
</HTML> 

以上是小编给大家分享的JavaScript判断按钮被点击的方法,希望大家喜欢。

相关文章

  • JavaScript淡入淡出渐变简单实例

    JavaScript淡入淡出渐变简单实例

    这篇文章主要介绍了JavaScript淡入淡出渐变实现方法,涉及javascript页面元素样式的渐变操作技巧,非常简单实用,需要的朋友可以参考下
    2015-08-08
  • JavaScript实现点击图片换背景

    JavaScript实现点击图片换背景

    这篇文章主要为大家详细介绍了JavaScript实现点击图片换背景,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-11-11
  • JavaScript设计模式中的观察者模式

    JavaScript设计模式中的观察者模式

    这篇文章主要介绍了JavaScript设计模式中的观察者模式,观察者设计模式适用于监听一对多的操作,例如监听对象属性的修改等等,观察者模式能够降低代码耦合度,提升可扩展性
    2022-06-06
  • javascript实现上传图片并预览的效果实现代码

    javascript实现上传图片并预览的效果实现代码

    图片上传预览,就是在使用文件选择框选择了文件之后就可以在页面上看见图片的效果,关于这个效果我一直认为是无法做到的
    2011-04-04
  • JavaScript代码因逗号不规范导致IE不兼容的问题

    JavaScript代码因逗号不规范导致IE不兼容的问题

    这篇文章主要介绍了JavaScript代码因逗号不规范导致IE不兼容的问题的相关资料,需要的朋友可以参考下
    2016-02-02
  • 微信小程序开发篇之踩坑记录

    微信小程序开发篇之踩坑记录

    这篇文章主要给大家介绍了关于微信小程序开发篇之踩坑记录的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2021-03-03
  • 微信小程序数据监听器使用实例详解

    微信小程序数据监听器使用实例详解

    这篇文章主要介绍了微信小程序数据监听器使用实例,数据监听器用于监听和响应任何属性和数据字段的变化,从而执行特定的操作。它的作用类似于vue中的watch侦听器
    2023-04-04
  • 使用apifm-wxapi模块中的问题及解决方法

    使用apifm-wxapi模块中的问题及解决方法

    这篇文章主要介绍了使用apifm-wxapi模块中的问题及讲解决,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2019-08-08
  • JavaScript中的16进制字符(改进)

    JavaScript中的16进制字符(改进)

    后来经过自己的测试,发现将字符转换为十六进制的方法不完善。
    2011-11-11
  • 手机端转换rem适应

    手机端转换rem适应

    本文主要介绍了手机端转换rem适应的方法实例。具有很好的参考价值。下面跟着小编一起来看下吧
    2017-04-04

最新评论