Kanasan.JS Prototype.js CodeReading #6: Days on the Moon
Kanasan.JS Prototype.js CodeReading #6 に行ってきました (当日のチャットログ、参加者のブログ記事一覧)。今回は Prototype.js 1.6.0.2 の 3375 行目、フォームに関する部分から最後まで読みきりました。 Form.Methods.findFirstElement (3449 行目) フォームコントロールを取得するメソッドですが、tabindex 属性でタブ移動順が指定されていた場合は、その順序がもっとも早いコントロールを返そうとしているようです。しかしその際、tabindex 属性の値が 0 のものを値が 1 のものより優先しているようで、実際のタブ移動順と得られる結果が一致しません。HTML 4 では tabindex 属性の値 0 は、tabindex 属性を指定しないのと同じ効果を持つはずなのですが。 フォーカスと選択範囲
prototype.js のイベント・トリガー (hPod)
最近 prototype.js (1.5.0_rc1) を使うようになってから、おやと思ったことがある。 onclick などのイベントの処理を簡単に登録できるのはいいけれど、それを任意に発動させるトリガーにあたる機能がない？ たとえばほかに使っているライブラリ Google Maps API にはあるので、できないこともないのだろうけど、なぜこの有名な prototype.js にないのだろう。 一方で scriptaculous.js (v1.6.4) はと見てみると、 unittest.js の中に、それらしい機能が埋め込まれていた。 Event.simulateMouse とか、 Event.simulateKey とか。しかしこれらには experimental というコメントが付けられていたし、それにぱっと見ただけで制作途中であるような感じでもあった。 こうして scripta
日本の休日に対応したカレンダーコントロール『protocalendar.js』 | Recently Ajax
「予約希望日」など、フォームで日付を指定する機会はよくあります。しかし、ドロップダウンなどで選んでもらうと、「次の日曜日に」といったような指定がしにくい上、「2月 31日」など日付として不正なものが指定されるなどして、いろいろと面倒です。 そこで、JavaScriptでカレンダーを表示して日付を選ばせる方法があります。 『protocalendar.js』もその一つ。Yahoo! UI Libraryなどでも同種のものはありますが、ここで紹介するのは日本の方が日本向けに作成したカレンダー。祝祭日などもしっかり日本向けになっているため、非常に使いやすいと言えます。 使い方も、ライブラリをダウンロードして参照した後、次のように組み込むだけ。 <input id="simple_calendar" name="simple_calendar" type="text" /><br /> <scr
Prototype.js 1.5.0 がこの一週間めちゃめちゃ更新してるので、新しい機能をまとめてみた - IT戦記
最近の Prototype.js LL Ring でも言ったけど、まったくもって 4 ヶ月間更新なしだった。。。 しかし！ ここ、 1 週間でこんなに更新があった！ http://dev.rubyonrails.org/changeset?new=spinoffs%2Fprototype%404950&old=spinoffs%2Fprototype%404236 ということで、新しい機能まとめ DOM 要素に observe, stopObserving Element.Methods に observe が追加された。 var handler = alert.bind(null, 'クリックありがとう！'); $('target').observe('click', handler); // うーん、直感的！ $('target').stopObserving('click', han
Backstage of theater.js - *[prototype.js解読]
前回最後にHashクラスに言及したので見てみます。 【抜粋】 function $H(object) { return new Hash(object); }; var Hash = Class.create(Enumerable, (function() { if (function() { var i = 0, Test = function(value) { this.key = value }; Test.prototype.key = 'foo'; for (var property in new Test('bar')) i++; return i > 1; }()) { function each(iterator) { var cache = []; for (var key in this._object) { var value = this._object[key];
![Backstage of theater.js - *[prototype.js解読]](https://cdn-ak-scissors.b.st-hatena.com/image/square/06a15c64ba0ceec233d86d71001ebb29a9dcbf5d/height=288;version=1;width=512/https%3A%2F%2Fcdn.blog.st-hatena.com%2Fimages%2Ftheme%2Fog-image-1500.png)
Prototype.js - Effectサンプル
これはオブジェクト指向JavaScriptライブラリ PrototypeのEffectのサンプルです。付属のサンプルにちょっと手を加えてちょっ と日本語訳したものです。 Effect.Fade() & Effect.Appear() 呼び出し方法 new Effect.Appear(element) new Effect.Fade(element) コード例 onclick="new Effect.Appear('appear')" onclick="new Effect.Fade('appear')"
IT戦記 - Prototype.js を使った JavaScript OOP 講座 #02
社内の勉強会の資料をここに公開していきます。社内の人も社外の人も読んでください。 ※ターゲットは JavaScript は書いたことない、オブジェクト指向言語プログラマ。 ※信念は「教わるのではなく、必死に着いていきませう」 今週はかなりハードボイルドで全身タイツのような忙しさなので、みんなが春を分けて楽しんでいたり、香港に行って楽しんでいる間にせこせこ資料を作っています。 はぁ。 Section 00 Prototype.js の前に JavaScript と DOM とイベントの概要 HTML は読み込まれた後、すべての情報が JavaScript のオブジェクトに変換される。 イメージ的にはこんな感じ <html> <head> <title>タイトル</title> </head> <body> ： ： </body> </html>↓↓↓ var document = { doc
Prototype.js を使った JavaScript OOP 講座 #01
社内の精鋭エンジニアを中心に定期的に勉強会をすることになった。んで、 JavaScript の講義は僕がやることになった。 資料を社内だけでとどめておくのはもったいないので、ここに公開していきます。社内の人も社外の人も読んでください。 講義の内容は基本的にソース嫁。ソースレビュー形式。 ※ターゲットは JavaScript は書いたことない、オブジェクト指向言語プログラマ。 Section 00 Prototype.js の前に JavaScript のオブジェクトの概要・・・ オブジェクトを作ってみる。 var object = {};オブジェクトにメソッドとかプロパティを追加してみる。 var object = { field: 'IT戦士', method: function() { alert('hello ' + this.field); } }; object.method()
prototype.js 1.4rc4 Part.3 - IT戦記
なんか、この前書いてたやつが文字制限で書ききれなかったので三部構成にしてみました。 これが第三部。 第一部：http://d.hatena.ne.jp/amachang/20051123/1132584098 第二部：http://d.hatena.ne.jp/amachang/20051124/1132584232 注：引数に要素の id 属性値を指定する関数及びコンストラクタは要素オブジェクトそのものを入れても同じ動作です。 Ajax Ajax.activeRequestCount <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="ja"><head><title>Test</title><script type="text/jav
prototype.js 1.4rc4 Part.2 - IT戦記
なんか、この前書いてたやつが文字制限で書ききれなかったので三部構成にしてみました。 これが第二部 第一部：http://d.hatena.ne.jp/amachang/20051123/1132584098 第三部：http://d.hatena.ne.jp/amachang/20051125/1132584378 注：引数に要素の id 属性値を指定する関数及びコンストラクタは要素オブジェクトそのものを入れても同じ動作です。 Element Element.visible <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html lang="ja"><head><title>Test</title><script type="text/javascript
prototype.js 1.4rc4 Part.1解説
なんか、この前書いてたやつが文字制限で書ききれなかったので三部構成にしてみました。 これが第一部。 第二部：http://d.hatena.ne.jp/amachang/20051124/1132584232 第三部：http://d.hatena.ne.jp/amachang/20051125/1132584378 注：引数に要素の id 属性値を指定する関数及びコンストラクタは要素オブジェクトそのものを入れても同じ動作です。 汎用関数 $ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html lang="ja"><head><title>Test</title><script type="text/javascript" src="prototype
prototype.jsのものすごく簡単な使い方。 : blog.nomadscafe.jp
prototype.jsのものすごく簡単な使い方。 はてなダイアリーの方にprototype.jsでHTMLを汚さないロールオーバースクリプトというエントリーを書いたのだが、prototype.jsの入手方法やらすごく簡単な使い方がないようなので、書いてみます。 prototype.jsはJavaScriptのライブラリ（中身はJavaScriptです)で、これを使うとJavaScriptを組むのがかなり楽になるというものです。話題のAjaxのプログラミングも簡単にできます。 ライブラリは、 http://prototype.conio.net/ からダウンロードできますが、TOPページにあるファイルはちょっと古いものなので、Browse the darcs repositoryというリンクを辿り、 http://dev.conio.net/repos/prototype/dist/ から
prototype.js でデザインパターン - Iterator
Ruby on Rails や Catalyst のプラグインなんかでは prototype.js という JavaScript のライブラリを使って、Ajax サポートを実現しています。prototype.js とフレームワークが必要な Ajax の JavaScript コードを吐き出してくれるので、Ruby プログラマや Perl プログラマは JavaScript の実装を意識しなくても Ajax なインタフェースが作れる、という風になっています。 こんな感じで prototype.js は Ajax な部分に注目が集まっていますが、ほかにも "Class-style OO" なフレームワークも内包してます。 JavaScript はプロトタイプベースのオブジェクト指向言語で、C++ や Java のようなクラスベースのオブジェクト指向言語とはちょっと実装が異なります。プロトタイプ
CodeZine：プロトタイプ（prototype）によるJavaScriptのオブジェクト指向（プロトタイプ, オブジェクト, Javascript, ECMASCript）
はじめに JavaScriptはオブジェクト指向言語です。しかし、そのオブジェクトの性質は、他に良く知られているオブジェクト指向言語のJavaやC++と大きく異なっています。 そこでこの記事では、なぜそのような違いがあるのか、JavaScriptにおけるオブジェクト指向の言語思想を見ていくと共に、その違いの根幹であるプロトタイプについて解説していきたいと思います。 なお、この記事はJavaScriptの解説ですが、その内容は、標準仕様のECMAScriptで扱われる範囲に基づいています。従って、同じくECMAScriptを元にしている言語（JScript、ActionScript）でも通じる内容になっています。 対象読者 プログラミングの基本的な知識、ならびにオブジェクトやメソッドと言った基礎的な概念については、ここでは解説しません。最低限、オブジェクト指向プログラミングについて
prototype.js v1.5.0 の使い方
それは何？ prototype.js は Sam Stephenson によって書かれた JavaScript ライブラリです。 この熟考の上記述された標準に準拠したコードは、Web 2.0 において特徴となるリッチでインタラクティブなウェブページを制作する際の重荷を、あなたの肩から取り去ってくれるでしょう。 もしこのライブラリを使ったことがあるなら、充実したドキュメントがこのライブラリの売りではないことに気がついたはずです。 私は他の開発者と同様に、ソースコードを読み、試行錯誤しながら prototype.js を理解しました。 自分が学んでいる間にメモを取り、それを他の人たちと共有することは価値があるのでは、と考えたのです。 加えて、このライブラリによって提供されているオブジェクト、クラス、関数、拡張機能についての 非公式リファレンス も提供しています。 ここで提供する例とリファレンス
prototype.js の Ajax.Responders.register - 2nd life (移転しました)
最近のprototype.js(1.4_rc1かな？)から追加されたAjax.Responders.registerがかゆいところに手が届く感じで便利です。何をする物かと云うと、prototype.jsを使ってAjaxる場合、Ajax.Requestを通して通信を行います。そのAjax.Requestすべての通信開始時と終了時に任意のfunctionを登録できる機能です。早速 http://rails2u.com:8008/ (safariリンククリック注意！ブラウザがハングアップするという話) でRESTWikiに組み込んでみました。これで裏で非同期に通信を行ってるとき、ブラウザの右上に視覚的に'loading...'の文字が表示されます。 実装方法は非常に簡単で Ajax.Responders.register({ onCreate: function() { if($('busy')
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
prototype.js リファレンス
http://blogus.xilinus.com/pages/javawin