web-dev-qa-db-ja.com

同じonclickから2つの関数を呼び出す

HTMLとJS

1つのonclickイベントから2つの関数を呼び出す方法は?これが私のコードです

 <input id ="btn" type="button" value="click" onclick="pay() cls()"/>

2つの関数はpay()とcls()です。ありがとうございます。

92
user182

両方とも機能するように、関数呼び出しの最後にセミコロン;を追加します。

 <input id="btn" type="button" value="click" onclick="pay(); cls();"/>

最後のものが必須であるとは思わないが、ちょっと、それを加えればよいでしょう。

これはSitePointからの良い参照です http://reference.sitepoint.com/html/event-attributes/onclick

173
Chris Bier

両方を呼び出す単一の関数を作成し、それをイベントで使用することができます。

function myFunction(){
    pay();
    cls();
}

そして、ボタンの場合:

<input id="btn" type="button" value="click" onclick="myFunction();"/>
30
Renan

他の関数の中から関数を呼び出すことができます

<input id ="btn" type="button" value="click" onclick="todo()"/>

function todo(){
pay(); cls();
}
15
pollirrata

JQueryの場合:

jQuery("#btn").on("click",function(event){
    event.preventDefault();
    pay();
    cls();
});
9
Lucien Baron

HTMLからイベントをバインドすることはお勧めできません。これはお勧めの方法です。

document.getElementById('btn').addEventListener('click', function(){
    pay();
    cls();
});
8
karaxuna

多様性を提供するためだけに、 カンマ演算子 も使用できますが、 "noooooo!"と言う人もいるかもしれませんが、うまくいきます:

<input type="button" onclick="one(), two(), three(), four()"/>

http://jsbin.com/oqizir/1/edit

7
elclanrs
onclick="pay(); cls();"

しかし、 "pay"関数でreturn文を使っていると、実行は停止し、 "cls"は実行されません。

これに対する回避策:

onclick="var temp = function1();function2(); return temp;"
6

ステートメント終了文字として、2つの関数の間にセミコロンを入れます。

5
pk2218

これを試して

<input id ="btn" type="button" value="click" onclick="pay();cls()"/>
4
Sachin