読者です 読者をやめる 読者になる 読者になる

Yahoo! UI Library のカレンダー('-')

Yahoo! UI Library のカレンダーを使ってみてるんですが、なぜかカレンダーのオブジェクトを保持する変数をグローバルで見えるようにしな駄目なんです。サンプルもこんな感じ。

var cal1;
function init() {
    cal1 = new YAHOO.widget.Calendar("cal1","cal1Container");
    cal1.render();
}

コンストラクタの第1引数に渡す "cal1" ってのが変数名と一致してなだめで、かつその変数はグローバルでないと駄目なんですが、いったい中で何をやってるんでしょう。だいぶ嫌な感じです。まさか window[id] 見たいな事をしてるのかって思って解析してみました。

こんなコード発見。

var linkRight=document.createElement("A");
linkRight.href="javascript:"+this.id+".nextMonth()";

おぉぉぉい!!Σ( ̄□ ̄;)

そりゃないっすよ。なんかの冗談ですか?自分の nextMonth メソッドをなんで外の変数を通じて呼び出してるんですか??いやいや、そんなの click イベント拾ってそこで呼びだしゃいいじゃないっすか!!

ってことで、以下のように変更。あっ、ちなみにこれは次月・先月移動用のリンクで近くに linkLeft もあるんですけど省略してます。

var linkRight=document.createElement("A");
//linkRight.href="javascript:"+this.id+".nextMonth()";
var self = this;
YAHOO.util.Event.addListener(linkRight,"click",function(e){
    self.nextMonth();
});

っていうか、他の場所ではこうなってるのになぜにこの部分だけ・・・。コードをいくら追いかけてみても理由が分かりませんでした。

で、これで最初のサンプルコードも以下のようにかけます。

function init() {
    var cal1 = new YAHOO.widget.Calendar("cal1","cal1Container");
    cal1.render();
}

ふぅ。これでグローバルなスコープでなくなったんで一安心です。