やりたいことは、ある画像をドラッグして、特定の枠内にドロップしたら、そこに留まり（枠にしっかり収まるようにする）、枠外であれば元の場所に戻るようにしたいです。以下サイトが、それを実現しているのですが、
ソースの理解が全然できないため質問しました。
http://diaspar.jp/node/43
わからないこと
1.ソース一式ダウンロードして実行したところ、エラーが発生。
(158行目)
Droppables is not defined
[Break on this error] Droppables.add(drop, optDropzone);
prototype.jsの行592でエラーになっている。
587 var Enumerable = {
588 each: function(iterator, context) {
589 var index = 0;
590 iterator = iterator.bind(context);
591 try {
592 this._each(function(value) {
2.
JavaScript部分の最初に「(function() {」とあるがこれは何を意味するか？
//<
No.1
99
18
60pt
> 1.ソース一式ダウンロードして実行したところ、エラーが発生。
当方ではできました。
156、157行目のスクリプトファイル読み込み設定が間違っていませんか？ 記事のときとはバージョンが変わっていますのでそのあたりもチェックしてください。
> 2.JavaScript部分の最初に「(function() {」とあるがこれは何を意味するか？
「function(){}」は無名関数と呼ばれるものです。関数そのものをすぐに変数等に格納したり、返却したりする場合、名前をつけなくてもOKです。
また、
(funstion(){ //コード }());
は以下と同じです。
funstion test(){ //コード } test();
前者は関数を定義と同時に実行してます。
この場合も無名関数でOKです。
サンプルだと211行目が関数の終わり＋実行です。
このソースはprototype.js + script.aculo.usフレームワークを使用していますので
ソースの理解にはJavaScriptの基本に加え、各フレームワークの知識が必要となります。
http://www.openspc2.org/JavaScript/Ajax/ref/prototype.js/
http://www.openspc2.org/JavaScript/Ajax/ref/script.aculo.us/
prototype.jsは私も旧バージョン(1.4.0)の解読記録をブログに載せましたが
http://d.hatena.ne.jp/susie-t/archive?word=%2a%5bprototype%2ejs%...
最新バージョンは使い方すら追えてないです・・・。
参考になれば幸いです。
susie-t
2008/10/13 23:58:16
1
1
2
121
120
>記事のときとはバージョンが変わっていますのでそのあたりもチェックしてください。
記事と同じバージョンのPrototype.js & script.aculo.us をセットしたらできました。ありがとうございます！！
（バージョンが少し違うだけで動かない場合があるのですね。勉強になりました。）
>「function(){}」は無名関数と呼ばれるものです。関数そのものをすぐに変数等に格納したり、返却したりする場合、名前をつけなくてもOKです。
理解しました。コード比較を書いて頂き感謝します。
教えて頂いたことを手がかりに、コード全体を理解できるように調べます。また質問するかもしれませんが、よろしくお願いします。
---------
（追記）
function test(){
//コード
}
test();
上記形式に変更しても問題なく動きました。