параметра Pass для функции (е)

Question

Я ужасно с JS и мне нужно использовать хорошую кнопку, я получил здесь: http://codepen.io/rikschennink/pen/lEuLD/

Короче говоря, в HTML, у меня есть:

<button data-label="click here!"></button> 

и в сценариях:

var loading = function (e) { 
    e.preventDefault(); 
    e.stopPropagation(); 
    e.target.classList.add('loading'); 
    e.target.setAttribute('disabled', 'disabled'); 
    setTimeout(function() { 
     e.target.classList.remove('loading'); 
     e.target.removeAttribute('disabled'); 
    }, 1500); 
}; 


var btns = document.querySelectorAll('button'); 
for (var i = btns.length - 1; i >= 0; i--) { 
    btns[i].addEventListener('click', loading); 
} 

Я понимаю, что при загрузке страницы, добавляется прослушиватель события и функции (е) запускается на выполнение по щелчку. Мне нужно, чтобы иметь возможность вызвать другую функцию и передать ей параметр после выполнения функции (e), которая будет выполнять реальную работу. Как я могу это сделать?

Другими словами, без кнопки фантазии, я обычно в состоянии вызвать функцию с помощью:

<button onclick="functionName(id)"; data-label="click here!"></button> 

Мне нужно, чтобы иметь возможность вызвать функцию FunctionName (ID) после нажатия на кнопку фантазии делай свою работу!

Я знаю, что это может быть очень просто, но я все еще не мог этого сделать.

спасибо!

Answer 1

вы можете добавить его после того, как click обратный вызов завершен:

var loading = function (e) { 
    e.preventDefault(); 
    e.stopPropagation(); 
    e.target.classList.add('loading'); 
    e.target.setAttribute('disabled', 'disabled'); 
    setTimeout(function() { 
     e.target.classList.remove('loading'); 
     e.target.removeAttribute('disabled'); 

     functionName(); //CALL YOU FUNCTION HERE 
    }, 1500); 
}; 

Answer 2

Вы можете передать объекты в обработчик событий.

Вот пример на jsfiddle:

https://jsfiddle.net/csLhymtz/

function MyObject (myTextArgument) { 
    this.myTextArgument = myTextArgument; 
} 

MyObject.prototype.handleEvent = function (event) { 
    if (event.type === "click") { 
     this.clickHandler(); 
    } 
} 

MyObject.prototype.clickHandler = function() { 
    alert(this.myTextArgument); 
} 

var myObject = new MyObject ("i have been clicked"); 
var hello = new MyObject ("hello world"); 

$("#myButton")[0].addEventListener("click", myObject, false); 
$("#secondButton")[0].addEventListener("click", hello, false); 

Вы можете прикрепить обработчик кнопки и в качестве второго аргумента передать JavaScriptObject.

Такой объект будет передавать события функции handleEvent.

Там вы можете проверить, какое событие вы получили, и в зависимости от того, что выполняет надлежащий обработчик событий. Вы можете создать объект со всеми необходимыми аргументами и получить к ним доступ к событиям.