Ответы:
onclick="doSomething();doSomethingElse();"Но на самом деле лучше не использовать onclickвообще, а подключать обработчик событий к DOM-узлу через код Javascript. Это известно как ненавязчивый JavaScript .
onclick=""нет onClick="". Это очень распространенная ошибка.
jsxнет, htmlи этот вопрос не был помеченjsx
Ссылка с определенной функцией
<a href="#" onclick="someFunc()">Click me To fire some functions</a>Запуск нескольких функций из someFunc()
function someFunc() {
showAlert();
validate();
anotherFunction();
YetAnotherFunction();
}
Этот код требуется, если вы используете только JavaScript, а не jQuery
var el = document.getElementById("id");
el.addEventListener("click", function(){alert("click1 triggered")}, false);
el.addEventListener("click", function(){alert("click2 triggered")}, false);
Я бы использовал element.addEventListenerметод, чтобы связать его с функцией. Из этой функции вы можете вызывать несколько функций.
Преимущество, которое я вижу в привязке события к одной функции и последующем вызове нескольких функций, состоит в том, что вы можете выполнить некоторую проверку ошибок, иметь некоторые операторы if else, чтобы некоторые функции вызывались только при соблюдении определенных критериев.
Конечно, просто привяжите к нему несколько слушателей.
Short cutting with jQuery
$("#id").bind("click", function() {
alert("Event 1");
});
$(".foo").bind("click", function() {
alert("Foo class");
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="foo" id="id">Click</div>var btn = document.querySelector('#twofuns');
btn.addEventListener('click',method1);
btn.addEventListener('click',method2);
function method2(){
console.log("Method 2");
}
function method1(){
console.log("Method 1");
}<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Pramod Kharade-Javascript</title>
</head>
<body>
<button id="twofuns">Click Me!</button>
</body>
</html>Вы можете достичь / вызвать одно событие одним или несколькими методами.
Вы можете добавлять несколько только по коду, даже если у вас есть второй onclickатрибут в html, он игнорируется и click2 triggeredникогда не печатается, вы можете добавить его в действие, mousedownно это всего лишь обходной путь.
Поэтому лучше всего добавить их по коду, как в:
var element = document.getElementById("multiple_onclicks");
element.addEventListener("click", function(){console.log("click3 triggered")}, false);
element.addEventListener("click", function(){console.log("click4 triggered")}, false);<button id="multiple_onclicks" onclick='console.log("click1 triggered");' onclick='console.log("click2 triggered");' onmousedown='console.log("click mousedown triggered");' > Click me</button>Вы должны быть осторожны, так как события могут накапливаться, и если вы добавите много событий, вы можете потерять счет в порядке их запуска.
Одним из дополнений для поддерживаемого JavaScript является использование именованной функции.
Это пример анонимной функции:
var el = document.getElementById('id');
// example using an anonymous function (not recommended):
el.addEventListener('click', function() { alert('hello world'); });
el.addEventListener('click', function() { alert('another event') });Но представьте, что у вас есть пара из них, прикрепленных к тому же элементу, и вы хотите удалить один из них. Невозможно удалить одну анонимную функцию из этого прослушивателя событий.
Вместо этого вы можете использовать именованные функции:
var el = document.getElementById('id');
// create named functions:
function alertFirst() { alert('hello world'); };
function alertSecond() { alert('hello world'); };
// assign functions to the event listeners (recommended):
el.addEventListener('click', alertFirst);
el.addEventListener('click', alertSecond);
// then you could remove either one of the functions using:
el.removeEventListener('click', alertFirst);Это также делает ваш код намного проще для чтения и обслуживания. Особенно, если ваша функция больше.
Вы можете объединить все функции в одну и вызывать их. В библиотеках, подобных Ramdajs, есть функция для объединения нескольких функций в одну.
<a href="#" onclick="R.compose(fn1,fn2,fn3)()">Click me To fire some functions</a>или вы можете поместить композицию как отдельную функцию в файл js и вызвать ее
const newFunction = R.compose(fn1,fn2,fn3);
<a href="#" onclick="newFunction()">Click me To fire some functions</a>Это альтернатива Brad Anser - вы можете использовать запятую следующим образом
onclick="funA(), funB(), ..."однако лучше НЕ использовать этот подход - для небольших проектов вы можете использовать onclick только в случае вызова одной функции (более подробно: обновлен ненавязчивый javascript ).