シェアする

フロントエンジニアがよく使う基本的なjquery処理集

フロントサイド開発時にjqueryを利用する事が多いと思いますが、
慣れていてもふと忘れる時があります。
そんな時に備忘録として、よく使う処理を紹介します。

要素の値取得

$('[セレクタ]').val();

要素の非表示

$('[セレクタ]').hide();

要素の表示

$('[セレクタ]').show();

セレクトボックスに変更があった時等の検知

$('[セレクタ]').change(function() {
    // 処理
});

テキストボックスに変更を加えた時等の検知

$('input[type="text"], [セレクタ]').change(function() {
    // 処理
});

テキストボックスの変更を検知

$('input[type="text"], [セレクタ]').keyup(function() {
    // 処理
});

チェックボックスをクリックした時等に検知

$("input[type="checkbox"], [セレクタ]").on("click",function(){
    // 処理
});

data属性の取得

$(this).data('[属性名]');

その他でよく使う処理についても、随時追加していきます。