jQueryのサンプルを気ままにアップして行きます。一応解説は付けてはいますが、基本的に、jQueryの基本をマスターしている方向けです。jQueryは、Ver.1.7以上を前提にしています。解説が良く分からないという方は、管理人による「jQuery入門道場」本を是非ご一読下さい。また、こちらで紹介するコード（プログラム）は、各々のプログラムにおいて自由にご利用していただいて構いません。但し、ブログなどへの無断転載はお辞め下さい。 【フォーム系】 チェックボックス系 チェックボックスにチェックできる数を制限する テーブル行のクリックでチェックボックスをチェックさせる チェックボックスのチェックで、背景などに色を付ける（change編） チェックボックスのチェックで、背景などに色を付ける（click編） ラジオボタン系 チェック付いているラジオボタンのラベルに色を付ける セレクト系 セレクト
ajaxに関するmytkbizのブックマーク (36)
-
mytkbiz 2015/03/29
-
ピュアAJAXアーキテクチャのススメ
先日、ここで発表したFacebookユーザーむけグループウェア「Fruence.com」。今年のトレンドになるであろう「ソシアル・アプリ」の実例という意味もあったが、私自身の中で少し前から形になりつつあった「AJAXを最大限に活用した新しい形にウェブ・アプリケーション」のアーキテクチャの実践という意味合いも大きい。 このアーキテクチャの特徴は以下の３つである。 サーバー側は、JSON over HTTPのAPIとHTML/CSS（およびそのテンプレート）をスタティックな形でのみ提供する（サーバー側では、ダイナミックなHTMLの生成はしない） クライアント側では、JavaScriptを使ってサーバーから取得したJSONとHTMLのテンプレートを組み合わせて（データ・バインドして）表示する。 ウェブサイトはあたかも独立したアプリのように動き、操作中はURLは一切変化しない もともとは、HTML
-
ページ移動の必要が無くなるページング系jQueryプラグイン・Pagination Plugin - かちびと.net
ページングのユーザビリティを あげたいけど、オートタイプは 嫌だ、と言う方にオススメの jQueryプラグインがありました。 選択肢の一つに如何でしょう。 タブのような感覚でページ移動が出来ます。ページ数の多いサイトはユーザビリティとしても取り入れたいですね。
-
Blue Eyes Blue: ファイルマネージャーAjaXplorerのインストール
AjaXplorerは、PHPとJavascriptで書かれたAjaxベースのGUIファイルマネージャーだ。http://ajaxplorer.sourceforge.net/wordpress/特徴として、CSSを使った美しい画面、視覚的なアイコンベースのインターフェース、エクスプローラー的な操作性、Web上でのエディタ機能、ゴミ箱、認証機能をもつ。使用されているライブラリは・prototype.js・WEBFX WIDGETS・MODAL WINDOWS・CODEPRESS・DEWPLAYER などインストール、設置は至って簡単だが、adminのログイン、ログアウトの仕様がいま一つ納得がいかない。＜検証環境＞CentOS 5 ＋ Apache 2 ＋ PHP 5 ＋ AjaXplorer 2.3＜インストール＞１．まずは、ソースをダウンロードしインストール＊最新版はここhttp://s
-
-
またまた登場！凄くリッチなWEBアプリ作成フレームワーク「Ajax.org Platform」:phpspot開発日誌
またまた登場！凄くリッチなWEBアプリ作成フレームワーク「Ajax.org Platform」 2009年12月16日- またまた登場！凄くリッチなWEBアプリ作成フレームワーク「Ajax.org Platform」。 Ext.js ばりにきれいなUIと多機能さで今後が期待されるJSフレームワークです。 次のような綺麗でリッチなインターネットアプリケーションが作れます。 デモページには多数のコンポーネントが掲載されていて色々できることがわかります。 GoogleMapや、各種UIパーツの他、３Dグラフなんかも面白いです。 JavaScript でクネクネ動く3Dグラフです。 以下のページを参照してください。 Ajax.org - The real-time collaborative application platform
-
ハイテンションAjax入門 - 三等兵
JSが少しできる人ならうじうじ考えるほどのこともでもない！ 何も難しいことはない！ぶっとんぢまいなよ！ヒャッパー！！！ というノリでAjaxを学んでみました。醜いです。 Ajax入門 Ajaxはいろいろできるんだぜ！ 以上入門終り！キミは完璧だ！次いけ！ Ajaxは非同期通信だかなんだかそんなもんはどうでもいいんだ！ どうでもいい！そんなことよりもXMLHttpRequestオブジェクト生成！ var request = false; if(window.XMLHttpRequest) { request = new XMLHttpRequest(); //frefox ie7,8 safai opera } else if(window.ActiveXObject) { try { request = new ActiveXObject("Msxml2.XMLHTTP"); // ie6
-
連載：jQuery逆引きリファレンス 第1回 セレクタ編 － ＠IT
jQueryは近年、JavaScriptライブラリの中でも高い人気を持ち、急速に普及してきたライブラリです。jQuery自体はオープンソースで開発が進められるライブラリですが、2008年9月にマイクロソフトが正式サポートすることを表明したことから、今後は、ASP.NETの世界でも採用される機会が多くなってくると予想されます。本連載が、これからjQueryを利用される方の有用な資料となれば幸いです。 なお、本連載はリファレンスという性質上、入門レベルからの解説は行っていません。jQueryの基本については、拙稿「ASP.NETプログラマーのためのjQuery入門」も併せて参照することをお勧めします。 それではさっそく始めましょう。まずは、jQueryのキモともいえる「$()関数」で使える、さまざまなセレクタ構文についてまとめていきます。 id値で要素を特定するには？ タグ名で要素を特定するに
-
jQueryを使い始めたときに感じる13の疑問 : tech.kayac.com - KAYAC engineers' blog
来週は私が夏休みなので更新はない予定です。agoです。 最近、人にjQueryを解説する機会があったので、昔を思い出してjQueryを使い始めた頃に感じる疑問を書いてみたいと思います。 1 そもそも何で使うの？いまでも困ってないよ 作成する内容にもよりますが、慣れると使用しない場合に比べて記述するコード量が3分の1程度まで減ります。 また、変数、条件分岐、繰り返しが減るのでバグが発生しにくくなります。 2 何か特殊なことができる？ 結局できることは変わりません。 jQuery自体JSで書かれてますし、記述の自由度もJSの制約に制限されます。 3 何が難しいの？ 文法がややjQuery的になります。 参考 jQuery言語入門 jQuery自体のコード量は少ないのですが、独特の記述法が多く慣れるまで多少時間がかかるかもしれません。 また、CSS Selectorの知識はほぼ必須です。 特にマ
-
MOONGIFT: » jQueryでその場で入力チェックを行う「jQuery Inline Form Validation Engine」:オープンソースを毎日紹介
入力された値の検証は最終的にサーバ側で行わなければ意味がない。が、ユーザビリティを考えるとブラウザ上でチェックし、通知できれば便利に違いない。問題はそうしたチェック機能を実装するのが手間だと言うことだ。 jQueryを使ってWebブラウザ上で入力チェック 動的なフォーム生成でも柔軟に対応できるくらいシンプルな入力チェックライブラリがjQuery Inline Form Validation Engineだ。 今回紹介するオープンソース・ソフトウェアはjQuery Inline Form Validation Engine、jQueryプラグインで提供される入力チェックライブラリだ。 jQuery Inline Form Validation Engineの良い点は、入力チェックがブラウザ上で行われ、かつそのエラー内容が入力項目の横にフローティングで表示される所だ。吹き出し風になっており、非
-
JavaScriptでできること・できないこと
さまざまなプログラミング言語がありますが、プログラミングそのものに触れてみたいと思うならJavaScriptをお勧めします。Webブラウザとメモ帳があれば、本格的なプログラミングに挑戦できるのです（編集部） プログラミングを学びたいと思ったら 皆さんは、JavaScriptというと何を思い浮かべるでしょうか。 Webで動的なユーザーインターフェイスを実現するための技術でしょうか。それとも、オブジェクト指向のスクリプティング言語でしょうか。JavaScriptというキーワードを聞いたことがある程度という方もいるでしょう。 JavaScriptは現在多くのWebブラウザに搭載され、さまざまな場面でWebの中核技術を支えているスクリプティング言語です。 本連載は、プログラミングを初めて学ぶ人を対象にしたJavaScriptの入門記事です。特に次のような方のために分かりやすく解説を行っていきます。
-
Ajaxフォトアルバムのフェードイン画像フレームを作ろう －＠IT
本連載では、Ajaxを活用したインタラクティブなWebアプリケーションを、ゼロから開発する。3回の連載で、簡単なWebフォトアルバムを完成させる予定だ。完結した機能を持ったAjaxアプリケーションを作り上げるステップを、具体的に解説していきたい。 JavaScriptと非同期データ送受信を組み合わせた、Webアプリケーション開発スタイルである「Ajax」は、このキーワードが発表されたのが今年初めのことだとは思えないほどの発展を遂げており、日々新しい実験や、それを組み込んだサービスが発表されている。 そろそろ実際にAjaxを活用したWebアプリケーションを開発してみようか、と考えている開発者も多いことだろうが、ではAjaxで何をどう作ったらいいんだろう？ という部分で立ち止まってしまってしまっているのではないだろうか。 そこで本連載では、単なるサンプルではなく、完結した機能を持ったAjaxア
-
AjaxZip 2.0
Kawa.netxp AjaxZip 2.0 - Ajax郵便番号→住所自動入力フォーム（CGI不要版） AjaxZip2は、昨年公開した 『ajaxな住所入力フォーム』 の新バージョンです。 郵便番号を入力すると、該当する都道府県名・住所が自動的に入力されます。 Ajaxと JSON フォーマットを利用するJavaScriptライブラリとして公開しました。 JavaScript のみで稼動するため、サーバサイドで稼動するCGIプログラムは不要です。 郵便番号→住所変換処理は全てクライアントサイドのJavaScriptで行います。 既存 HTML の住所入力フォームをたった3行書き換えるだけで利用できます。 簡単に設置できるため、プログラムに詳しくない方でも導入していただけると思います。 以下の住所入力フォームに、7桁の郵便番号を入力してみてください。 【2007/12/09 追記】 jQ
-
［ASP.NET AJAX］ASP.NET AJAX Control Toolkitを利用するには？［2.0、3.0、3.5、C#、VB］ - ＠IT
＠IT > Insider.NET > .NET TIPS > ［ASP.NET AJAX］ASP.NET AJAX Control Toolkitを利用するには？［2.0、3.0、3.5、C#、VB］ .NET TIPS ［ASP.NET AJAX］ASP.NET AJAX Control Toolkitを利用するには？（2008年7月改訂版）［2.0、3.0、3.5、C#、VB］ 山田 祥寛 2007/03/01 2008/06/05 更新 2008/07/31 更新（大幅に改訂） 2009/10/08 更新 ASP.NET AJAX Control Toolkit（以降、Control Toolkit）は、マイクロソフトが無償で提供する「ASP.NET AJAX」をベースに構築されたサーバ・コントロール集だ（ASP.NET AJAXについては「DBプログラミング 7つのヒント - 同
-
ASP.NET AJAXの開発をさらにサポート「ASP.NET 3.5 SP1」
Visual Studio 2008 Service Pack1から、ScriptManagerコントロールの機能強化が行われ、AJAX機能のサポートが行われています。また、ASP.NET Controls for Silverlightにより、Silverlightのメディアやコンテンツをサポートするコントロールの追加も行われています。本稿では、ASP.NET 3.5 SP1/ASP.NET Controls for Silverlightの概要とアプリケーションの作成について学びたいと思います。 はじめに Visual Studio 2008 Service Pack1（以下、VS2008）の追加機能の一つにASP.NET AJAXのScriptManager（ScriptManagerProxyも含む）コントロールの機能強化があります。また、11月にリリースされた、ASP.NET C
-
PHP+Ajaxの日本語も対応した超高機能ファイルマネージャ
いいですねこれ。 AjaxとPHPの4と5で動きます。実行するのに、データベースを使用しないという点も見逃せませんねぇ。 主な機能もご紹介。 ダウンロードは以下から Ajaxplorer.info : the ultimate ajax file manager. ドキュメント Ajaxplorer.info サンプルデモ http://www.ajaxplorer.info/demo/ ユーザー名 demo パスワード demo 主な機能 ファイル/フォルダの操作。ダウンロード。 名前の変更/コピー/移動/削除/。 そして画像のサムネイル表示。 また、検索機能も付いているので、ファイルを探すのが楽そうです。 FLASHプレイヤー内臓なので、FLASHも直接見れる。 ZIPファイルもファイルマネージャー上で閲覧が出来る。 MP3もその場で聞ける。 目的のファイルをブックマークする事ができ
-
Aptanaで始めるJavaScriptライブラリ「jQuery」超入門
JavaScriptライブラリ「jQuery」とは？ 最近、Flashの代わりにJavaScriptを利用してリッチなデザインのWebサイトを構築する事例が増えてきました。特にグーグルのサービスは、JavaScriptをうまく取り入れている例として誰もがご存じでしょう。 例えばGoogleマップは、Webブラウザ上でマウスをドラッグ＆ドロップするだけで、地図を自由に操作できます。このような操作感は、まるでWebサイトであることを意識させない作りになっています。 本来、JavaScript自体はインターネットが広まり始めたころから存在していて、決して目新しい技術ではないのですが、Webブラウザの種類やバージョンによって挙動が異なることから、JavaScriptを使って大掛かりな仕組みを作ることは不可能だと考えられてきました。 しかし、最近ではWebブラウザは自動的にバージョンアップされるよう
-
-
Java用Ajaxを使ったWebアプリケーションフレームワーク·Echo Web Framework MOONGIFT
※ 画面は公式サイトデモより プログラミング言語がそうであるように、フレームワークにおいても開発の向き不向きが存在する。開発するシステムやその特性に応じて最適なフレームワークを選択することは、開発の工数を下げたりユーザビリティを向上させる効果があるだろう。 まるでWeb OSのようなインタフェース 最近は基幹システムにおいてもWebアプリケーション化が進められている。そこでJavaを使った基幹システムであれば、Echo Web Frameworkの導入を考えてみても良さそうだ。 今回紹介するオープンソース・ソフトウェアはEcho Web Framework、Javaを使ったWebアプリケーション開発に役立つフレームワークだ。 Echo Web Frameworkはプレゼン層のフレームワークであるが、JettyやTomcat向けのライブラリが提供されており、Javaをサーバサイドに、Java
-
Script.aculo.usで、ビジュアルなWebページを作成しよう
はじめに Ajaxの登場によりJavaScriptへ多くのWeb開発者の注目が集まって以降、JavaScriptは、クールなWebページを作る上でなくてはならないものとなってきています。特に、ビジュアルな表示や効果を実現するためには、JavaScriptは今や不可欠のものといってよいでしょう。以前は、こうしたものをJavaScriptで実装するには気の遠くなるコーディングが必要でしたが、現在は多数のJavaScriptライブラリが登場し競い合っています。JavaScriptを手軽に導入したい、という人には夢のような時代となった、といってよいでしょう。 が、あまりに多くのライブラリが登場したため、果たしてどれを使えばいいのか、よく分からなくなってしまった、という人も多いでしょう。また、機能を高度化するあまり、使い方がひどく難しくなってしまっているライブラリもあります。比較的簡単に、しかも効果
公式Twitter
- @HatenaBookmark
リリース、障害情報などのサービスのお知らせ
- @hatebu
最新の人気エントリーの配信
キーボードショートカット一覧
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Copyright © 2005-2025 Hatena. All Rights Reserved.
設定を変更しました