Jörn Zaefferer's personal blog about music, software and anything else.
jQueryは非常にコンパクトで多機能なJavaScript/Ajaxライブラリです。サイズは16KB弱と非常にコンパクト。サイズが小さいだけでなく記述方法も短くすむのも利点の1つです。prototype.jsや他のライブラリでは繰り返し処理をしてイベントを設定したりするのですがjQueryは、その繰り返し処理を記述する必要が、ほとんどないため非常にコンパクトにスクリプトを記述することができるわけです。また、prototype.js同様に$()でオブジェクトにアクセスすることができます($()によるアクセスはAdobe Spryでもサポートされています)。 まず、簡単なところでページが読み込まれたらアラートダイアログを表示させてみましょう。通常はwindow.onload = function() { alert(~); }のように記述しますが、jQueryではonloadイベントではなく
【2024年8月】レンタルサーバーおすすめ10社を徹底比較! 人気ランキングも PR 最終更新日:2024年08月16日
Events/jQuery.Event jQueryのイベントシステムは、W3C標準に準拠した実装になっています。イベントオブジェクトはjQueryのイベントハンドラーに確実に渡されます。(コールバック関数に引数として渡されず、window.eventなどから取得するタイプのブラウザであっても、そのようなチェックは必要ありません) オリジナルのイベントオブジェクトが持つ殆どのプロパティは、このオブジェクトにコピーされます。 このオブジェクトのコンストラクタも公開されており、triggerを呼ぶ際に用いられます。 コンストラクタではありますが、newオペレータはあってもなくても構いません。 どういった場面でEventオブジェクトを作成するのかは、trigger関数のドキュメントを参照して下さい。 Example: jQuery.Eventを new をつけずに作成する var e = jQu
どうも、俺@仕事中です。 jQuery+Ajaxを使ってインタラクティブなデザインのシステムを構築中なのですが、ちょっとハマったのでめも。 画面にテーブルとか使って、何かデータを一覧表示した場合に、クリックされた要素のvalue値やname属性の値やidの値とか取りたくて、取りたくて、、、取れなくて1時間悩みました。。。 例えば <td><a href="foo" id="foo_id" value="foo_value">FOO</a></td> <td><a href="bar" id="bar_id" value="bar_value">BAR</a></td>のようなテーブルがあるとします。 これでjQueryで'FOO'をクリックした時に、その<a>タグに指定してあるid値やvalue値を取得したい!場合は $("a").click(function() { id = $(thi
jQueryを使って、クリックイベントを簡単に追加することができます。 aタグにクリックイベントを追加する。 $("a").click(function(){ alert("click a!"); } ); divでidがmessage2のものにクリックイベントを追加します。 $("div#message2").click(function(){ alert("click message2!"); } ); idがmessage3のものにクリックイベントを追加します。 $("#message3").click(function(){ alert("click message3!"); } ); click関数を使ったサンプルコード <html> <head> <title>jQuery</title> </head> <body> <div id="message1">div 1</div
第 6 回 は「見栄えの良いツリーナビゲーション」です。 今回は CSS と言うよりも jquery の plugin「Treeview」を使ったツリーナビゲーションをご紹介したいと思います。 実装するとこのような感じになります。 ホーム 会社案内 会社概要 コンセプト 沿革 社長挨拶 交通アクセス 採用 中途採用 中途採用情報 エントリー 新卒者採用 新卒者採用情報 エントリー 先輩の声 プライバシーポリシー お問い合わせ 設置方法 上のサンプルの設定を例に説明します。 まずサイトから「Treeview」をダウンロードします。 解凍してフォルダを置く(解凍したフォルダ名を js に変更) <head>~</head>内に <link rel="stylesheet" href="js/jquery.treeview.css" /> <script type="text/javascrip
なんとなく使っているだろう.ready()メソッドについて詳細に見てみましょう。 .ready()メソッド .ready()メソッドという呼び方がパッとしない人もいると思います。こういうのです↓ $(function(){ // .ready()が呼び出されたときに実行されるハンドラ }); jQueryを実行する際のおまじないみたいなものですね。これの中にjQueryコードを書いていくとページロード時(Documentの読み込みが完了時)に実行してくれます。 何気なく使ってる人も多いと思いますが、実際のところこれは何?ということで、少し掘り下げてみましょう。 .ready()を使う際の形式 jQuery APIによれば、以下の3つが.ready()として同じように使えるようです。 $(document).ready(handler) $().ready(handler) (推奨されていな
Note as of April 2010: While the plugin still works as it is, it has some shortcomings, and not maintained anymore. There are now plenty of alternative jQuery tree plugins, like jsTree. Note October 2010: Despite the above, I’ve moved the plugin to GitHub, fixed a bug when combining persist: “location” and prerendered: true, and released (tagged in Git) 1.4.1. Transform an unordered list into an e
jQueryとは、JavaScriptのコーディングを強力に支援するライブラリです。 $('.semooh a').hover( function(){ $(this).text('ヌ?'); }, function(){ $(this).text('ヌー'); } );
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く