cluchのブログ

業務で使ったり、学んでいる知識を忘れないために覚書として使っていく予定。

jQuery

Sortableによる並べ替え

やりたいこと ドラッグ&ドロップで、要素を並べ替えられるようにしたい << 追加要件 >> 並び替えドラッグ時に表示するカーソルを指定したい 移動中の項目を半透明にしたい 移動先のスペースをハイライト表示したい 並び順をクッキーに保存したい ソース…

郵便番号による住所検索

やりたいこと 郵便番号を入力して住所を検索したい 使用したAPI on( events [, selector] [, data], handler(eventObject)) マッチした要素に任意のイベントをバインドします。 match 文字列中で一致するものを検索する String のメソッド。 結果情報の配列…

Ajaxの基本

Ajaxとは 「Asynchronous SavaScript + XML」の略称で、 JavaScriptから、非同期に通信を行って、 XMLデータを取得し、その内容を取り扱うものです。 jQueryを使う利点 Ajaxはブラウザによって、 「XMLHttpRequestオブジェクト」の実装方法が異なります。 jQ…

入力数値をカンマ区切りにする

やりたいこと 金額などのカンマをフォーカスが失われた時に入れたい フォーカスを受けたときはカンマを無くしたい 今回使ったAPI focus(fn) フォーカスを受け取ったタイミングで発生する。 blur(fn) フォーカスを失ったタイミングで発生する。 val() 全ての…

セレクタ

#id 指定されたidを持つ要素を選択する。 ex)ボタン押下で「1番目」のみを赤くする。 .html <p id="first">1番目</p> <p id="second">2番目</p> <p id="third">3番目</p> <input type="button" id="bt" value="クリック"> .js $(function() { $("#bt").click(function() { $("#first").css("color", "red") }); }); .class 指定されたクラスを持つ要素を選択する。 e…

jQueyの基本

jQueryは下記サイトから入手可能です。 http://jquery.com/jQuery ダウンロードしたファイルを読み込むには、 外部のJavaScriptを読み込むのと同じように、 下記のように指定してやります。 <script type="text/javascript" src="js/jquery-1.11.2.min.js"></script> jQueryの基本文法 $(function(){ $("セレクタ").メソッド(パラメ…