Question

如何在HTML或JavaScript中按钮的onclick方法调用两个方法？

Answer 1

试试这个：

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

或者，在第一个函数结束时调用第二个函数：

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

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

...并调用按钮的func1（）onck：

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

Answer 2

正如Harry Joy所说，你可以在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();
};

如果您需要在单击的元素范围内运行的函数，可以简单地使用apply：

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

Answer 3

现代事件处理方法：

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

第一个参数是事件，第二个参数是函数，第三个参数指定是否允许事件冒泡。

来自QuirksMode：

W3C的DOM Level 2事件规范非常注意传统模型的问题。它提供了一种简单的方法来为一个元素上的同一事件注册尽可能多的事件处理程序。

W3C事件注册模型的关键是方法addEventListener()。你给它三个参数：事件类型，要执行的函数和稍后我将解释的布尔值（true或false）。要将我们熟知的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/

Answer 4

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

function functionA()
{

}

function functionB()
{

}

Answer 5

<强>您好，

你也可以这样做...这样，你的两个函数都应该调用，如果两个函数都返回true，那么它将返回true，否则返回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

如何在HTML或JavaScript中按钮的onclick方法调用两个方法？

5 个答案: