信鸽网

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

  作者：bea

本文实例讲述了javascript实现点击后变换按钮显示文字的方法。分享给大家供大家参考。具体实现方法如下： <html xmlns="http://www.w3.org/1999/xhtml"><head> <title>显示一些按钮，如果点击了， 当前点击的按钮文本变为“点了”，其他按钮文本变为“没点”</title> <script type="text/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程序设计有所帮助。




有用  |  无用

猜你喜欢

您可能感兴趣的文章: