网络编程
位置:首页>> 网络编程>> JavaScript>> javascript实现点击后变换按钮显示文字的方法

javascript实现点击后变换按钮显示文字的方法

作者:永远爱好写程序  发布时间:2024-07-12 13:14:40 

标签: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程序设计有所帮助。

0
投稿

猜你喜欢

手机版 网络编程 asp之家 www.aspxhome.com