Как вызвать два метода в методе onclick кнопки в HTML или JavaScript?

Ответ 1

Попробуйте следующее:

<input type="button" onclick="function1();function2();" value="Call2Functions" />

Или вызовите вторую функцию в конце первой функции:

   function func1(){
     //--- some logic
     func2();
   }

   function func2(){
    //--- some logic
   }

... и вызовите func1() onclick кнопки:

<input type="button" onclick="func1();" value="Call2Functions" />

Ответ 2

Как сказано Гарри Джой, вы можете сделать это на onclick attr, как это:

<input type="button" onclick="func1();func2();" value="Call2Functions" />

Или в вашем JS так:

document.getElementById( 'Call2Functions' ).onclick = function()
{
    func1();
    func2();
};

Или, если вы программно назначаете onclick и не уверены, существовал ли предыдущий onclick (и не хотите перезаписывать его):

var Call2FunctionsEle = document.getElementById( 'Call2Functions' ),
    func1 = Call2FunctionsEle.onclick;

Call2FunctionsEle.onclick = function()
{
    if( typeof func1 === 'function' )
    {
        func1();
    }
    func2();
};

Если вам понадобятся функции, выполняемые в рамках элемента, который был нажат, может быть выполнено простое применение приложения:

document.getElementById( 'Call2Functions' ).onclick = function()
{
    func1.apply( this, arguments );
    func2.apply( this, arguments );
};

Ответ 3

Современный метод обработки событий:

element.addEventListener('click', startDragDrop, false);
element.addEventListener('click', spyOnUser, false);

Первый аргумент - это событие, второе - это функция, а третье указывает, разрешать ли пузырить события.

Из QuirksMode:

W3Cs DOM Уровень 2 Спецификация событий уделяет пристальное внимание проблемам традиционной модели. Он предлагает простой способ зарегистрировать столько обработчиков событий, сколько вам нравится для одного и того же события на одном элементе.

Ключом к модели регистрации событий W3C является метод addEventListener(). Вы даете ему три аргумента: тип события, выполняемую функцию и логическое (истинное или ложное), которое позже объясняет. Чтобы зарегистрировать нашу хорошо известную функцию doSomething() для onclick элемента, который вы делаете:

Полная информация здесь: http://www.quirksmode.org/js/events_advanced.html

Использование jQuery

Если вы используете jQuery, есть хороший API для обработки событий:

$('#myElement').bind('click', function() { doStuff(); });
$('#myElement').bind('click', function() { doMoreStuff(); });
$('#myElement').bind('click', doEvenMoreStuff);

Полная информация здесь: http://api.jquery.com/category/events/

Ответ 4

<input type="button" onclick="functionA();functionB();" />

function functionA()
{

}

function functionB()
{

}

Ответ 5

Привет,

Вы также можете сделать так, как показано ниже... Таким образом, ваши обе функции должны вызывать, и если обе функции возвращают true, тогда он вернет true else return false.

<input type="button" 
     onclick="var valFunc1 = func1(); var valFunc2 = func2(); if(valFunc1 == true && valFunc2 ==true) {return true;} else{return false;}" 
     value="Call2Functions" />

Спасибо, Vishal Patel