javascript实现点击后变换按钮显示文字的方法
更新时间:2015年05月13日 11:32:11 作者:永远爱好写程序
这篇文章主要介绍了javascript实现点击后变换按钮显示文字的方法,可实现显示一些按钮如果点击了,按钮文本变为“点了”,其他按钮文本变为“没点”的效果,非常具有实用价值,需要的朋友可以参考下
本文实例讲述了javascript实现点击后变换按钮显示文字的方法。分享给大家供大家参考。具体实现方法如下:
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>显示一些按钮,如果点击了, 当前点击的按钮文本变为“点了”,其他按钮文本变为“没点”</title> <script type="text/javascript"> //为所有按钮动态添加事件 function IniButtonEvent() { var Items = document.getElementsByTagName("input"); for (var i = 0; i < Items.length; i++) { var objTmp = Items[i]; if (objTmp.type == "button") { objTmp.onclick = ButtonClick; } } } function ButtonClick() { var Items = document.getElementsByTagName("input"); for (var i = 0; i < Items.length; i++) { var objTmp = Items[i]; if (objTmp.type == "button") { //判断是否是按钮 //window.event.srcElement触发当前事件的元素 //用来判断是否是当前单击的按钮 if (objTmp == window.event.srcElement) { objTmp.value = "点了"; } else { objTmp.value = "没点"; } } } } </script> </head> <body onload="IniButtonEvent()"> 显示一些按钮,如果点击了,当前点击的按钮文本变为“点了”, 其他按钮文本变为“没点”<br /> <input type="button" value="没点" /> <input type="button" value="没点" /> <input type="button" value="没点" /> <input type="button" value="没点" /> <input type="button" value="没点" /> </body> </html>
希望本文所述对大家的javascript程序设计有所帮助。
相关文章
zepto中使用swipe.js制作轮播图附swipeUp,swipeDown不起效果问题
Swipe JS 是一个轻量级的移动滑动组件,支持 1:1 的触摸移动,阻力以及防滑性能都不错,可以让移动web应用展现更多的内容,能解决我们对于移动Web对滑动的需求。下面小编给大家介绍zepto中使用swipe.js制作轮播图附swipeUp,swipeDown不起效果问题,需要朋友可以参考下2015-08-08javascript实现在网页任意处点左键弹出隐藏菜单的方法
这篇文章主要介绍了javascript实现在网页任意处点左键弹出隐藏菜单的方法,设计鼠标事件及css样式操作的相关技巧,需要的朋友可以参考下2015-05-05你必须知道的Javascript知识点之"深入理解作用域链"的介绍
本篇文章小编为大家介绍,你必须知道的Javascript知识点之"深入理解作用域链"的介绍。需要的朋友参考下2013-04-04
最新评论