javascript implements the method of displaying text after clicking the transform button

2020-06-12 08:25:33
OfStack

This article illustrates javascript's method of displaying text after clicking the transform button. Share to everybody for everybody reference. Specific implementation methods are as follows:


<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <title> According to 1 Some buttons, if I click, 
  The text of the currently clicked button becomes "clicked", while the text of other buttons becomes "not clicked". </title>
 <script type="text/javascript">
 // Add events dynamically for all buttons 
 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") {
  // Determine if it's a button 
   //window.event.srcElement The element that triggers the current event 
   // Determines whether the button is currently clicked 
   if (objTmp == window.event.srcElement) {
   objTmp.value = " O 'clock ";
   }
   else {
   objTmp.value = " No point ";
   }
  }
  }
 }
 </script>
</head>
<body onload="IniButtonEvent()">
 According to 1 Some buttons, if clicked, the text of the currently clicked button changes to "clicked", 
 Other button text becomes "no dot" <br />
 <input type="button" value=" No point " />
 <input type="button" value=" No point " />
 <input type="button" value=" No point " />
 <input type="button" value=" No point " />
 <input type="button" value=" No point " />
</body>
</html>

Hopefully, this article has been helpful in your javascript programming.