jQuery
Firebug限定だけどロード中の処理もプロファイリングできました。やり方は以下の通り。 初めて$(document).ready(fn);が呼ばれている箇所にブレークポイントを設定。 設定したブレークポイントで止まったら、コンソールにhttp://dev.jquery.com/~john/plugin…
$(document).ready(fn);などの、画面表示と同時に実行される処理もプロファイリングしたいのであればResigが説明していた方法しかないんだけど、画面表示後の処理をプロファイリング対象とするのであれば、以下の方法の方がずっと楽です＾＾ プロファイリン…
John ResigのブログのDeep Profiling jQuery Appsというエントリでprofiling pluginが紹介されていました。というわけで早速利用してみた。Resigが説明しているやり方は以下の通り。 プロファイリング対象のサイトのページをHTML保存。 保存したHTMLを編集し…
正式版がついにリリースされました。変更内容はこちら。今回のリリースのポイントは以下の２点かと。 JSファイルのビルド JSファイルのダウンロード時は、選択したコンポーネントをまとめたJSファイルがビルドされる。選択しなかったコンポーネントはJSファ…
jQuery 1.2.6のリリースノートがやっと公開されました。 jQuery 1.2.6の位置付け 1.2.6は1.2.3の次のバージョンだそうな。1.2.4と1.2.5がスキップされた理由は、1.2.4はビルドに失敗、1.2.5はパッチを適用し損ねたためです。 パフォーマンス改善 イベントの…
jQuery 1.2.5はjQuery 1.2.3のバグFIX版とのエントリを書きましたが、Visual Studio 2008 Intellisense for jQuery 1.2.5によると、どうやらdimensions.jsがjQuery 1.2.5から内包されるようになったようです。リリースノートがまだ出てないので把握しきれて…
リリースノートは現在更新中みたいです。1.2.5とDIFFした限りだと、バグFIXとIE固有の対応みたい？なんだかバタバタしてますな〜
jQuery 1.2.5がリリースされました。jQuery 1.2.3のバグFixなので、機能追加などは特にないようです。 ちなみにjQuery 1.2.4はビルドに失敗したまま公開しちゃったバージョンなので、一日しか公開されていませんでした。
jQuery UI 1.5 Beta3がリリースされました。まだドキュメントもチュートリアルもない状態だけど、デモはいくつか動いているので見てみるだけでも楽しいかも？JavaScriptでやりすぎ感もあるけどｗ 今のとこ以下のデモが公開されてました。 機能毎のデモ（http…
jQueryの日本語リファレンスのサイトが公開されました。慣れれば英語でも気にならないけど、初心者にはとっつきにくいのは事実なのでとってもありがたいです。 内容は最新バージョンの1.2.3に対応しています。素晴らしいです！
いつの間にやらjQuery 1.2.3がリリースされてました。 主なリリース情報はというと、 1.2.2のバグフィックス Adobe AIRとの互換 Drupal 6で利用される jQuery UI 1.5のベースとなるバージョン とのこと。 この中だとAdobe AIRとの互換とjQuery UI 1.5が気に…
$(DOMElement)の処理が300%高速化したそうです。 http://docs.jquery.com/Release:jQuery_1.2.2 http://journal.pc.mycom.co.jp/news/2008/01/15/044/index.html 主な変更点は以下の通り。 .ready()の改善 $(document).bind("ready", fn);なんて書き方でもdo…
ツールチップを表示するjQueryのプラグインとしてはjTip、tooltip demo、jQuery Tooltip Plugin、clueTipなどがあげられます。今回はこの中でも一番よさげなclueTipをご紹介。clueTipを利用すると、こんな感じでマウスのフォーカスに合わせてツールチップを…
jQuery Impromptuを利用すると、こんな感じに独自のプロンプトを表示することができます。 単純なプロンプトはこんなんでできちゃいます。 $(document).ready(function(){ $("#btn").click(function(){ $.prompt('Example 1'); }); }); 画像にあるようなプロ…
こないだ紹介した日付入力コントロールを利用する方法だけど、手入力で変な日付を入れられちゃうのがちょっと問題だったり。かといって手入力不可にするとユーザビリティ的にどうなの？って話。そんなわけで、これまたこないだ紹介したフォームの入力を制限…
以前紹介したdatePickerの新しいバージョン（v2）が出ているのでもう一度ご紹介。datePicker pluginを利用することで、上記のように日付入力コントロールを利用することができます。 こんなHTMLを用意して <form> 日付：<input name="date1" class="date-pick" /> </form> Javascriptをこんな風に定義します。 $(do…
Javascript jQuery Hotkeys Pluginを利用することで、キーイベントをハンドリングすることができます。デモページを見てもらえればどんな感じか分かるかと。 以下は、デモページで「←」「F11」「a」「r」「s」などのキーを押下したあとの画面です。 イベント…
こんな感じでフォームの入力文字を制限する方法。digitalBushのMasked Input Pluginを利用しています。 HTMLはこんな感じ。 <form> <table> <tr><td>日付</td> <td><input type="text" name="hoge1" id="date"/></td> <td>9999/99/99</td></tr> <tr><td>電話</td> <td><input type="text" name="hoge2" id="phone"/></td> <td>(999) 999-9999</td></tr> <tr><td>製品番号</td></tr></table></form>
こんな感じで入力位置の背景色を変える方法。 HTMLはこんな感じ。 <form> <input type="text" name="hoge1"><br/> <textarea name="hoge2"</textarea> </form> 例によって色はCSSで。 .focus { background-color: #ffffcc; } んでJavascriptをこんなん。 $(document).ready(function(){ $("input,textarea").focus(function(){ $(this).add</textarea></br/></form>…
こんな感じに偶数／奇数行で色を変えたり、マウスのフォーカスがある行に色をつける方法。 HTMLはこんなん。 <table id="result" border="1"> <tr><td>name1</td><td>value1</td></tr> <tr><td>name2</td><td>value2</td></tr> <tr><td>name3</td><td>value3</td></tr> <tr><td>name4</td><td>value4</td></tr> <tr><td>name5</td><td>value5</td></tr> </table> 色はCSSで決めた方が…
こんな感じに項目の表示／非表示を切り替える方法。 HTMLはこんなんで <a href="#" id="hoge">表示する</a> <div id="contents"> 表示／非表示されるコンテンツ部分 </div> Javascriptはこんな感じ $(document).ready(function(){ $("#contents").css("display", "none"); $("#hoge").toggle( function() { $("#h…
最近jQueryをよく使っているので、使い方のメモでも。 こんなHTMLに対して <form> テキスト： <input type="text" name="name1" id="hoge1" /><br /> ラジオ： 選択肢1<input type="radio" name="name2" class="hoge2" value="val1" /> 選択肢2<input type="radio" name="name2" class="hoge2" value="val2" /><br /> チェックボックス： 選択肢1</form>
通常onClick属性でイベント登録するとこも、jQueryだとこんなんで登録できます。 <form name="form1" id="fmAction"> <input type="button" id="confirmBtn" value="登録" /> </form> $(document).ready(function(){ $("#confirmBtn").bind("click", function() { if (confirm('登録しますか？')) { $("#fmAction").submit(); } }); });
こないだリリースされたばかりのjQuery UI 1.0のバグを早くも同僚が見つけました。どんなバグかというと、Firefoxで永久にJavascriptエラーが出続けるというもの（爆）。普通にサンプル動かしてたら発生したらしい。ダメじゃん orz 再現方法は以下の通りです…
9月16日よりjQuery UI 1.0がリリースされました！ jQuery UIは、jQuery上で動作するUIツールキット。オフィシャルブログのjQuery UI: Interactions and Widgetsというエントリで各機能やデモアプリが紹介されてます。こんなのとか こんなんとか YUIとかに比…
こないだリリースされたjQuery1.2に対するバグフィックスです。Release Notesによれば、主な変更点は以下の通り。 アニメーションの記述の変更 eq()の追加
jQuery1.2がリリースされました。 Release Notesによると、いくつかの機能追加と、1.1.4までに存在していた機能の一部を削除（下位互換プラグインにより互換性は保てる）または外部プラグイン化（XPath Selector Plugin）したようです。 ファイルとしては、…
Historyによると、主な変更点は速度向上とバグフィックスなんだとか。かなり速くなってるようなので、1.1.4以前のものを使ってる方は入れ替えてみては？ 1.1.x系としては最後のリリースで、9月には1.2がリリースされるようです。相変わらずJSライブラリは熱…
オレンジニュースでも取り上げられてたブログのエントリ。 早速compressed版からuncompressed版に置き換えてみたけど、体感的にはあんまり変わらない気も・・・？やっぱり利用するpluginやブラウザのJSエンジン、マシンスペックなんかの複合的な要因が影響す…
jQueryを利用してコンボボックスを選択状態にできないかなって思って調べていたら、selectで指定のものを選択状態にってエントリを発見。早速試してみました。 <select id="col1" name="col1"> <option value="val1">値1</option> <option value="val2">値2</option> <option value="val3">値3</option> </select> ってHTMLに対して $("#col1").val("val2"); って記述でほんとに選択状態にできま…
