QA@IT

既存のjsを含むHTMLを jsfiddle で編集する時の書き換え方

2176 PV

Google Chart APIを使うためにこちらのサンプルコードをコピーして、
https://google-developers.appspot.com/chart/interactive/docs/gallery/linechart

jsfiddle の HTML部分に全部を入れれば動いたのですが、
(Resoruce として https://www.google.com/jsapi の指定はしています。)
http://jsfiddle.net/fe26/sDYvb/

HTMLとJS部分を分割すると表が表示されなくなってしまいました。
http://jsfiddle.net/fe26/sDYvb/1

全てをHTML部分に書いたまま作業することもできるのですが、
できればちゃんと分離して書いておきたいので、どう書き換えればよいかアドバイスを頂けないでしょうか?

回答

jQueryのonloadだと関数の位置が変わったりするからではないかと思います。

以下のように NoWrap - in <Head>を指定すれば元ソースのような配置になるので動かすことができます。

http://jsfiddle.net/VUYq4/

出力位置が変わるだけで、jQueryのloadが使いたいなら自分でloadファンクション作成すれば動作可能でしょう。
(上記URLではプラグイン(jQuery 2.1.0)の指定を解除していますが例として解除しただけで指定できないわけではありません。)

$(window).load(function(){
}

右下のフレームのソースを見ながら実行してみるといいでしょう。

編集 履歴 (1)
  • `NoWrap - in <Head>` はそういう意味だったのですね。よく理解せずに `onLoad`を選んでしまっていました。ありがとうございます。 -
ウォッチ

この質問への回答やコメントをメールでお知らせします。