JSfiddleでjavascriptが機能しないケースについて

Question

下記のJSfiddleの中身をそのままサイトにコピペすると、きちんと「見出しの固定」が機能します。
しかしなぜか、JSfiddleでは機能せず、見出しはスクロールに応じて画面から消えてしまいます。
https://jsfiddle.net/1r78k44j/

どうすればJSfiddleでも機能するようになるのか、お分かりになる方いらっしゃいませんでしょうか？

尚、上のJSfiddleに書いてあるjavascriptは、下の「FixedMidashi」というライブラリの中身全てで、それだけをコピペしたものです。

■「FixedMidashi」
http://hp.vector.co.jp/authors/VA056612/fixed_midashi/manual/index.html
→テーブルの見出しを固定するライブラリ

Answer 1

Uncaught ReferenceError: FixedMidashi is not defined

Comments

[退会済みユーザー]

ありがとうございます。どうすればJSfiddleでも機能するようになるのでしょうか？初心者なものですみませんです。

Answer 2

• [LOAD TYPE] が [onLoad]
• window.onload = function () {};
• 上書き
• スコープ

要ソース確認。

• view-source:https://fiddle.jshell.net/1r78k44j/show/light/

Re: matsuzakaq さん

Comments

[退会済みユーザー]

ありがとうございます。

<script>
window.onload = function()
{
FixedMidashi.create();
};
</script>

の部分を、

<script>
$(window).load(function(){
FixedMidashi.create();
});
</script>

とか

<script>
function($){
FixedMidashi.create();
});
</script>

とかにすれば直るよ。ということでしょうか？

それとも他の部分でしょうか？

[think49]

window.onload と [LOAD TYPE] が [onLoad] なコード、どちらが先に実行されるか、確認しましたか。

[退会済みユーザー]

失礼しました。そのような意図でのご回答だったのですね。

window.onload
→「読み込んだときに実行してね」という意味だと思っています。

[LOAD TYPE] が [onLoad] なコード
→初耳でよくわかりません。

ただ文章から察するに、「書く順番を変えればいい」ということかと思います。そこで、先の部分をjavascript記入欄の一番最後に書いてみたりしたのですが、やっぱりうまくいきませんでした。(>_<)

[think49]

私も少し、勘違いしていたので、親記事に追記しておきました。

[退会済みユーザー]

ご回答の編集ありがとうございます。

書く順番というと、下記の部分ですよね。

window.onload = function()
{
FixedMidashi.create();
};

順番について考えられるのは上記の部分を、
➀HTMLの最初（質問にある場所）
➁HTMLの最後
③javascriptの最初
➃javascriptの最後

だと思いますが、どれでも機能しないようなのです…

あと、ご回答にあるリンク先は質問にあるものと同じのようですが、これはお間違いでなく、何か意図あってのものなのでしょうか？

すみません、業界のやりとりはまったくしらないものでして、何かの意図だとしたら、よくわかりませんでした。

[退会済みユーザー]

>要ソース確認

あ、なるほど。質問にあるJSfiddleだと、javascript記入欄に書いたものが読み込まれてないぞ。

という意図で、同じリンク先を貼ってくださったのですか？

すると、うーん。それはなぜで、どうしたらいいのでしょうか？順番を変えてもダメとなると…？

[think49]

https://fiddle.jshell.net/1r78k44j/show/light/ のソースを確認して下さい

[退会済みユーザー]

ごめんなさい。ソースを拝見しても、まったくわからないです。。

HTMLに書いたはずの

<script>
window.onload = function()
{
FixedMidashi.create();
};
</script>

がなくなってるなぁ。なんでだろう。

くらいまでしかわかりません。

[think49]

キーワードでググる事を覚えて下さい。
「window.onload 上書き」

[退会済みユーザー]

上書きしてしまうこちらを、
window.onload = function()
{
FixedMidashi.create();
};

上書きしないこちらに
window.addEventListener('load', function() {
FixedMidashi.create();
})

変えてみたのですが、ダメなようです…。

どうしたらできるようになるのでしょうか？

[defghi1977]

スクリプトのLoad Typeを「No wrap - in <body>」に変えてご覧？
すると, loadイベントの前にスクリプトが実行されてどっとはらい

[退会済みユーザー]

defghi1977さん
こんばんは。
仰るようにしたらできました。とてもうれしいです。誠にありがとうございます。どうやら、

<script>
window.addEventListener('load', function() {
FixedMidashi.create();
})
</script>

を書く場所は上でいいけれど、ライブラリの場所は

</body>の直前でなければならなかったのですね。

think49さん
おかげさまでいろいろと勉強になりました。
何度もご返信くださってありがとうございました。

[think49]

原因をご自身の頭の中で明快になるまで、確認しておくことをお勧めします。
問題解決がゴールではないと思いますので…。

[退会済みユーザー]

仰る通りだと思います。ご指導ありがとうございます。

ただ、いくつか検索しても整合性が取れず、原因が理解できません。

今回は問題解決と、原因の理解と、ググる力のうち、ググる力はあきらめまして、どうかthink49さん、原因の理解までお手伝いいただけませんでしょうか？

つまるところ、なぜ「No wrap - in <body>」に変えたら（ライブラリを</body>の直前に書いたら）できるようになったのですか？