[解決済み】jQueryでCSSのクラス変更時にイベントを発生させる。
2022-04-02 11:18:52
質問
jQueryでCSSクラスが追加・変更されたときにイベントを発生させるには?
CSSクラスが変更されると、jQueryのイベントが発生しますか?
change()
イベントを発生させることができますか?
解決方法は?
スクリプト内でクラスを変更するたびに
trigger
を使用して、独自のイベントを発生させることができます。
$(this).addClass('someClass');
$(mySelector).trigger('cssClassChanged')
....
$(otherSelector).bind('cssClassChanged', data, function(){ do stuff });
しかし、そうでなければ、クラスが変更されたときにイベントを発生させるためのベイクイン方法はありません。
change()
は、入力が変更された入力からフォーカスが外れた後にのみ発生します。
$(function() {
var button = $('.clickme')
, box = $('.box')
;
button.on('click', function() {
box.removeClass('box');
$(document).trigger('buttonClick');
});
$(document).on('buttonClick', function() {
box.text('Clicked!');
});
});
.box { background-color: red; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="box">Hi</div>
<button class="clickme">Click me</button>
関連
-
[解決済み] jQuery が Ajax 呼び出しの終了を待って戻るようにするにはどうすればよいですか?
-
[解決済み] jQueryの各ループから抜け出すには?
-
[解決済み] jQueryで要素が非表示になっているかどうかを確認するには?
-
[解決済み] 要素を水平方向にセンタリングする方法
-
[解決済み] CSSでcellpaddingとcellspacingを設定する?
-
[解決済み] jQueryの「exists」関数はありますか?
-
[解決済み] どのラジオボタンが選択されているかをjQueryで知るにはどうしたらよいですか?
-
[解決済み] jQueryを使用しない$(document).ready相当
-
[解決済み】別のウェブページにリダイレクトするにはどうすればいいですか?
-
[解決済み】jQueryでチェックボックスがチェックされているかどうかを確認するにはどうすればよいですか?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み】jQuery: outer html() [重複]。
-
[解決済み] jQuery .load()が動作しない
-
[解決済み] なぜbloodhound.get()は未定義を返すのですか?
-
[解決済み] jQueryのif文でのOR演算子の使用について
-
[解決済み] チェックボックスのオン/オフの切り替え
-
[解決済み] jQueryで小文字と大文字を使い分ける
-
[解決済み] JQuery Fancyboxが動作しない
-
[解決済み] jcarouselliteでbtnNextがクリックされたときに変数をインクリメントするには?
-
[解決済み] jqueryでアンカークリックをシミュレートするにはどうしたらいいですか?
-
[解決済み】「スタイル変更」イベントをリッスンすることは可能ですか?