Mockup generatorBring designs to life, effortlessly
Ajaxの普及とJavaScriptライブラリの出現や発展は車の両輪のように進んできた。Prototype.jsの出現はその先駆けだったといってよいだろう。今回は、そのAjax関連機能を取り上げる。バージョン1.6.0.2、Windows環境の場合で説明する。 サーバとの送受信 サーバとWebブラウザとの間でデータを送受信する際に、もっとも多く用いられるのはAjax.Requestだ。これはPrototype.jsのClassによって構築されているので、ここではクラスの1つとして紹介する。基本的な構成は以下のとおりだ。最初にnewを記述してインスタンスを生成させるようにすることが必要だ。 new Ajax.Request( 'アクセスするURL', { method : 'get'もしくは'post', // ..... その他オプション ..... onSuccess : functio
この機能を実行するにはprototype.jsが必要です 構文 Ajax.Request(url, options) 引数: url=URL, options=オプション 「Ajaxリクエストを行う」サンプルコード <html> <head> <title>Ajax.Request - Ajaxリクエストを行う</title> </head> <!--Ajaxリクエストを行うのサンプル--> <script type="text/javascript" src="/js/prototype.js"></script> <script type="text/javascript"> function execute() { var a = new Ajax.Request( "/samples/ajax/test.php", { "method": "get", "parameters":
Ajax.Requestを使ってサーバとの通信を行うことは出来るのですが、サーバ側にあるファイルを取得してクライアント側のHTMLページ内の指定の場所に表示するだけでれば、もう少し簡易な方法が用意されています。それがAjax.Updaterを使う方法です。 次の構文を使うことができます。 Ajax.Updater("表示するタグID", "ファイル名", { method: '通信方式' }); 通信が完了した時に実行する関数名を記述する代わりに、読み込んだファイルを表示する場所を表すID名を指定します。これで自動的にファイルを読み込んで表示してくれるようになります。 またAjax.Updaterを使う場合でも通信の成功時と失敗時で処理を分けることも可能です。Ajax.Requestの場合と少し異なり次のように記述します。 Ajax.Updater( { success: "表示するタグI
prototype.jsでAjax.Updaterを使う bookmark prototype.jsというライブラリのAjax.Updaterという機能を使えば、ページの特定部分を簡単に書き換えることが出来ます。 Ajax.Requestという機能で、Ajaxレスポンス取得後に、より細かい処理を行うことも出来ます。 コードを見てみよう bookmark Ajax.Updaterのコードとしては次のようになっています。 new Ajax.Updater( "container", "/samples/ajax/test.php", { "method": "get", "parameters": "a=b&c=d&e=f", onSuccess: function(request) { // 成功時の処理を記述 // alert('成功しました'); // var json; // eval
たつをさんのCSS と JavaScript でタブ切り替えをprototype.jsを使って書き直しました。 極力、再利用が簡単になるようにしてみました。 ライセンスは本家の「無償・無保証・著作権放棄」に準じます。 ご自由にお使いください。 サンプルはこちらからダウンロードできます。 基本コードは以下のようになっています。 <script type="text/javascript" src="prototype.js"></script> <script type="text/javascript" src="tabMaker.js"></script> <link href="tabMaker.css" rel="stylesheet" type="text/css" /> <div id="tabContent"> <ul id="tabIndex"> <li class="tab
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く