woshidan's blog

そんなことよりコードにダイブ。

書いたはずの関数が読み込まれてないみたいな件

codeacademyはどうしたよ、という感じですが、htmlの最初のとこだけやりました。

なんか英語になると大げさに褒められている気がしてうれしいですね。

 

で、その後はせっかく来週プログラミング部で集まりがあるので、ちょっと進捗があったほうが見栄えがいい……せっかくの機会なので、アウトプット優先にしよう、ということで作り損ねている新規登録画面を作ろうとしています。

 

それで、サーバとのデータの受けわたし部分は後回しにして

今週はJavascriptcssを使って選択している部分の色が変わる、とか、

学校選択したら学部の欄が出てくる、とかを作って遊んでました。

 

いまは時間割表の登録みたいなのがあって、その表のコマにIdを割り振ったあと、

コマをクリックしたらIdを取得するようにする、というのをやりたかったので、

・表の部分のhtml文を作る関数(createTable)

・表のコマのIdを取得する関数(getTablePlace)

を書いてみたのですが、二つ目は実行されず、

  1. Uncaught ReferenceError: getTablePlace is not defined schedule_entry.html:1

と表示されます。

 

原因としてありそうかな、と思ったのが、

・関数の読み込むタイミングがおかしい

・関数の呼び出し方がおかしい

 

で、・関数の読み込むタイミングについては

window.onload = function(){

・表の部分のhtml文を作る関数(createTable)

・表のコマのIdを取得する関数(getTablePlace)

}

と書いているので、まあ同時(crateTableでいじる前のhtmlを読み込んだ後)でしょう。

 

関数のプロトタイプ宣言みたいなはるか遠い昔のあいまいな記憶にもとづき

もしかして、上から下じゃない?と思って←

window.onload = function(){

・表のコマのIdを取得する関数(getTablePlace)

・表の部分のhtml文を作る関数(createTable)

}

という風に入れ替えたら動くかな、と思ったのですが、そんなことはなかったです。

 

もう一つの・関数の呼び出し方がおかしい については、

createTableで作っている各コマの中に

<a href="#" id="s' + j + i + '" onclick="getTablePlace(this.id)">EMPTY</a>

という感じでコマのidとクリックしたらこのidを渡してgetTablePlaceを呼びますよー

というつもりの文を入れてました。

ここはidの部分を変数入れてやってるだけで、他はサンプル通りだから大丈夫であってほしい。

 

願望言ってても仕方ないので、関数の読み込みのタイミングでなにかおかしいとしたら、

1個目の関数で呼び出す前に二個目の関数を読み込むようにすればいいのかなーってことで、

window.onload = function(){

・表の部分のhtml文を作る関数(createTable)

}

・表のコマのIdを取得する関数(getTablePlace) ←この関数の読み込み?はhtmlの読み込みを待たないから先に読み込まれてるはず

 

と変更してみたら、動きましたので、とりあえず前者の関数の読み込みタイミングだったのかなーと。

 

うーん、createTableでhtml文を書き直してる場合、

onclick=...って書いてる時点ではクリックして呼び出す対象の関数がないとダメなのかなぁ。

でも、そうしたらもっと順序にこだわりそうな場合はどうなるのかなー、と思いますが、必要になってから考え直しますか。

 

google先生jQueryに標準っぽくそういう機能があるみたいな感じの検索ワードをサジェストしてくるので、ややこしかったらそっちに移るのもありかな、とか、

もっとうまい方法見つけたら、とかいう感じですが。