[jQuery] 他要素のイベントを実行する

投稿日：2017年5月24日更新日：2018年5月2日

他要素のイベントを実行するサンプルです。

サンプルソース

例）「ボタン２」をクリックすると、「ボタン１」のクリックイベントを呼び出す

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>サンプル</title>
<script src="http://code.jquery.com/jquery-3.2.1.min.js"></script>
<script>
$(function(){
  $("#btn1").click(function(e){
    alert("★click");
  })

  $("#btn2").click(function(e){
    $("#btn1").trigger("click");  //#btn1のクリックイベントを呼ぶ
    //$("#btn1").click();         //この書き方でもOK
  })
});
</script>
</head>
<body>
  <input type="button" id="btn1" value="ボタン１">
  <input type="button" id="btn2" value="ボタン２">
</body>
</html>

<!DOCTYPE html>

<head>

$(function(){

$("#btn1").click(function(e){

alert("★click");

})

$("#btn2").click(function(e){

$("#btn1").trigger("click"); //#btn1のクリックイベントを呼ぶ

//$("#btn1").click(); //この書き方でもOK

})

});

</script>

</head>

<body>

</body>

</html>

解説

他要素のイベントを実行するには、triggerを使用します。

執筆者：とら