這篇文章主要介紹了javascript實(shí)現(xiàn)點(diǎn)擊后變換按鈕顯示文字的方法,可實(shí)現(xiàn)顯示一些按鈕如果點(diǎn)擊了,按鈕文本變?yōu)椤包c(diǎn)了”,其他按鈕文本變?yōu)椤皼]點(diǎn)”的效果,非常具有實(shí)用價值,需要的朋友可以參考下

本文實(shí)例講述了javascript實(shí)現(xiàn)點(diǎn)擊后變換按鈕顯示文字的方法。分享給大家供大家參考。具體實(shí)現(xiàn)方法如下：

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <title>顯示一些按鈕，如果點(diǎn)擊了，
 當(dāng)前點(diǎn)擊的按鈕文本變?yōu)椤包c(diǎn)了”，其他按鈕文本變?yōu)椤皼]點(diǎn)”</title>
 <script type="text/javascript">
 //為所有按鈕動態(tài)添加事件
 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觸發(fā)當(dāng)前事件的元素
   //用來判斷是否是當(dāng)前單擊的按鈕
   if (objTmp == window.event.srcElement) {
   objTmp.value = "點(diǎn)了";
   }
   else {
   objTmp.value = "沒點(diǎn)";
   }
  }
  }
 }
 </script>
</head>
<body onload="IniButtonEvent()">
顯示一些按鈕，如果點(diǎn)擊了，當(dāng)前點(diǎn)擊的按鈕文本變?yōu)椤包c(diǎn)了”，
其他按鈕文本變?yōu)椤皼]點(diǎn)”<br />
 <input type="button" value="沒點(diǎn)" />
 <input type="button" value="沒點(diǎn)" />
 <input type="button" value="沒點(diǎn)" />
 <input type="button" value="沒點(diǎn)" />
 <input type="button" value="沒點(diǎn)" />
</body>
</html>

希望本文所述對大家的javascript程序設(shè)計有所幫助。

您可能感興趣的文章: