-
ID:wfBCi. さんの質問

コード記述に関しての質問です。
かなり基礎的な部分でお恥ずかしいのですが、
ご教示いただけますでしょうか。

jQueryの記述を外部ファイルでまとめて管理しようと制作していましたが、
toggeleClassを記述したところ動作しませんでした。

まったく同じコードをhtmlファイルに
<script>囲みで記述すると動作するのですが
こういったケースの場合、原因はなにが考えられますでしょうか?

外部ファイルに記述してある他のコードは動作しているので
読み込み不備ではなさそうです。

ご回答のほどよろしくお願いいたします!

みんなの回答 2 件

ID:0apRfj さんの回答

問題を再現できるソースを載せて下さい。(再現出来れば十分なので、部分的なコードのみでも問題ないです)

ID:wfBCi.

ありがとうございます!

HTML
<p class="spNavBtn">てすと</p>
<div class="spNav">
<ul>
<li><a href="#a1">メニュー1</a></li>
<li><a href="#a2">メニュー2</a></li>
<li><a href="#a3">メニュー3</a></li>
</ul></div>

上記のようなHTMLがあり
spNav部分にclassを追加・削除したいと思い
以下のコードを記述しました。

jQuery
$(".spNavBtn").click(function() {
$(".spNav").toggleClass("active");
});

別ファイルにてcommon.jsを作成し
head内で呼び出しています。

ID:M89UjI さんの回答

初心者あるあるだね。
.spNavが登場する前に、jsで.spNavを指定してるから、そんな要素ありません的なことになってるよ。
いろいろ方法があるけれど、もっとも分かりやすい解決策は、scriptをbodyの一番最後に書くことだね。例の場合は、common.jsの読み込みをbodyの最後に書く感じ。

ID:wfBCi.

スマートなご回答ありがとうございます!
そんなに初歩的な部分だったとは…!
構造に対する理解が深まりました。
ありがとうございました!

最終更新日:2016-04-22 (1,223 views)

関連するトピックス

ページ上部に戻る