みなさんこんにちは、ゆうやです!
「俺ガイル」第3期のティザーPVが公開された今日このごろ、いかがお過ごしでしょうか。
本記事では、表題の通り「jQueryで他要素のイベントを実行する方法」を紹介します!
使用するシチェーションとしては、以下が挙げられます。
- 〇〇ボタンをクリックした時に△△のクリックイベントを実行したい
- □□をクリックしたときと同じ動作を☆☆をクリックした時にも行いたい
それでは早速見ていきましょう〜
共通のHTML
html
<div id="CircleBtn">〇〇ボタン</div>
<div id="TriangleBtn">△△ボタン</div>
triggerメソッドを使用する
js
$('#TriangleBtn').on('click', function(e){
$('.hogehoge').addClass('on');
});
$('#CircleBtn').on('click', function(e){
$('#TriangleBtn').trigger('click');
});
clickメソッドを使用する
js
$('#TriangleBtn').on('click', function(e){
$('.hogehoge').addClass('on');
});
$('#CircleBtn').on('click', function(e){
$('#TriangleBtn').click();
});
まとめ
いかがでしたでしょうか。
「他要素のイベント実行方法」を知ることはできましたでしょうか。
知っていればなんてことのないものでしたね笑
最後までご高覧いただきありがとうございました。