0

下記のようなコードがあるのですが、

$('.hoge').on('click',function (e){
  //中略
});

クリックせずに、クリックしたものとして呼び出すには、どう書けば良いですか?
・下記では駄目ですか?

$('.hoge').trigger('click');

具体例を追記しました
・下記でボタンクリックせずに、"hoge clicked!"とコンソールログ表示させるにはどう書けば良いですか?

<button class="hoge">hoge</button>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
$(function() {
  $('.hoge').on('click',function (e){
    console.log("hoge clicked!");
  });
  // .hogeのクリックイベントを実行する。
  $('.hoge').trigger('click');
});
</script>
2
  • 2
    具体例をスペユニットで実行すると、hoge clicked!がconsoleにでますけど。。なにかエラーがありますか?
    – Daichi
    Commented 2018年8月23日 2:01
  • 勘違いしていました。改めて確認したら、コンソール表示確認できました
    – re9
    Commented 2018年8月23日 3:07

1 件の回答 1

2

下記では駄目ですか?
$('.hoge').trigger('click');

駄目ではありません。triggerで良いです。

以下に、triggerの利用例を記載します。

$(function() {
  $('.hoge').on('click',function (e){
    console.log("hoge clicked!");
  });
  
  $('.moge').on('click',function (e){
    console.log("moge clicked!");
    // .hogeのクリックイベントを実行する。
    $('.hoge').trigger('click');
  });
  
  // 初回に.hogeのクリックイベントを実行する。
  $('.hoge').trigger('click');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="hoge">hoge</button>
<button class="moge">moge</button>

3
  • $('.hoge').trigger('click');を、$('.moge').on('click',function (e){}の中に書いているのはなぜですか? クリックイベントは、クリックしないと発火できない?? 疑問点を本文に追記しました
    – re9
    Commented 2018年8月23日 1:57
  • @re9 さん、クリックしなくても発火できます。サンプルを修正しましたので確認してください。
    – user29553
    Commented 2018年8月23日 2:24
  • 確認出来ました。ありがとうございます
    – re9
    Commented 2018年8月23日 3:06

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。