onlyforbopi
9/19/2018 - 6:17 PM

JS.Events.AddEventsOnclickAttrib

JS.Events.AddEventsOnclickAttrib

js-events-addeventsonclickattrib.markdown
content_copyfile_download
  • Rendered
  • Source

JS.Events.AddEventsOnclickAttrib

A Pen by Pan Doul on CodePen.

License.

index.html
content_copyfile_download
<!DOCTYPE html>
<html lang="en">
  <head>
  <title>Third example of an event listener</title>
    <meta charset="utf-8">
      <script>
        // An alternative method for adding an event listener to an HTML element: use 
        // an "on" attribute (ex: onclick = "....")
        // Instead of using b.addEventListener('click', callback), it's 
        // possible to use an onclick='doSomething();' attribute directly in the HTML 
        //tag of the element:
        //
        // <button id="myButton" onclick="processClick(event);">Click me!</button>
        // is ok when you only need a single event listener to click events for this 
        // button, as there can be only one onclick attribute per element.
        
        
        
         function processClick(evt) {
          alert("Button clicked");
        };
        
        // Using the b.addEventListener('click', callback) syntax,  you 
        // can register more than one event listener. You'll need rarely 
        // to do this, so in my opinion it's fine to choose whichever syntax you like.
        
      </script> 
</head>
<body>
  <button id="myButton" onclick="processClick(event);">Click me!</button>
</body>
</html>