Answers for "add event listener multiple events"

11

add event listener to multiple element in JS

document.querySelectorAll('.some-class').forEach(item => {
  item.addEventListener('click', event => {
    //handle click
  })
})
Posted by: Guest on August-07-2020
0

how to add multiple event listener in javascript

// events and args should be of type Array
function addMultipleListeners(element,events,handler,useCapture,args){
  if (!(events instanceof Array)){
    throw 'addMultipleListeners: '+
          'please supply an array of eventstrings '+
          '(like ["click","mouseover"])';
  }
  //create a wrapper to be able to use additional arguments
  var handlerFn = function(e){
    handler.apply(this, args && args instanceof Array ? args : []);
  }
  for (var i=0;i<events.length;i+=1){
    element.addEventListener(events[i],handlerFn,useCapture);
  }
}

function handler(e) {
  // do things
};

// usage
addMultipleListeners(
    document.getElementById('first'),
    ['touchstart','click'],
    handler,
    false);
Posted by: Guest on July-10-2020
0

multiple event with javascript

/* get the button id "tg" which is used for toggling.Then on click few 
elements with classname "adv" will disappear and at the same time few elements 
with classname "btnpro" will increase in width to 80px*. Upon second click  
elements with "adv" will appear again and the button width changes to 60px*/

document.getElementById("tg").onclick = function ()
{
  my_fun1();
  my_fun2();
}

function my_fun1()
{
  var x = document.getElementsByClassName("adv")
    for(var i=0; i<x.length;i++) {
      if (x[i].style.display === "none") {
        x[i].style.display = "block"
        flag = false
      } else {
        x[i].style.display = "none"
        flag = true           
      }      
    }  
}

function my_fun2()
{
  var x = document.getElementsByClassName("btnpro")
    for(var i=0; i<x.length;i++) {
      if(flag){
        x[i].style.width = "80px";
      }else{
        x[i].style.width = "60px";
      }  
    }
}
Posted by: Guest on September-28-2020
0

adding event listener to multiple elements

document.querySelectorAll('.some-class').forEach(item => {
  item.addEventListener('click', event => {
    //handle click
  })
})
Posted by: Guest on April-02-2021
0

addeventlistener javascript multiple functions

const invokeMe = () => console.log('I live here outside the scope');
const alsoInvokeMe = () => console.log('I also live outside the scope'); 

element.addEventListener('event',() => {    
     invokeMe();
     alsoInvokeMe();    
});
Posted by: Guest on April-07-2021

Code answers related to "add event listener multiple events"

Code answers related to "Javascript"

Browse Popular Code Answers by Language