0
ここに私の問題があります。私はあなたが以下に示すコードを持っています。なぜそれはここのように動作しません：http://jsfiddle.net/e6kaV/33/？
私に示されているエラーがあります：
{
"メッセージ"： "キャッチされないにReferenceError：$が定義されていない"、
"ファイル名"： "http://stacksnippets.net/js"、
"LINENO"：54、
は "colno"：13
}
私はJSまたはjQueryの仕組みがわからないので、あらゆる助けに感謝します。Javascript要素が機能しなくなる
.pane-launcher{
position:absolute;
top: 0;
width:80px;
height:80px;
display:block;
}
#rules {
left:0px;
}
#scenarios {
left:90px;
}
.pane{
position:absolute;
left: 0;
height:50px;
display:none;
opacity:1;
}
#rules-pane {
top:80px;
width:170px;
background-color:yellow;
}
#scenarios-pane {
top:80px;
width:170px;
background-color:blue;
}<html lang="en">
<head>
<meta charset="utf-8" />
<title>TEST</title>
<link rel="stylesheet" href="css.css">
</head>
<body>
<div id="rules" class="pane-launcher"><img src="http://placehold.it/80x80"></div>
<div id="rules-pane" class="pane">Model1</div>
<div id="scenarios" class="pane-launcher"><img src="http://placehold.it/80x80"></div>
<div id="scenarios-pane" class="pane">Model2<br><img src="http://placehold.it/170x20"></div>
<script>
$(".pane-launcher").click(function() {
\t // Set the effect type
var effect = 'slide';
// Set the options for the effect type chosen
var options = { direction: 'up' };
// Set the duration (default: 400 milliseconds)
var duration = 700;
$('.pane.active, #'+this.id+'-pane').toggle(effect, options, duration).toggleClass('active');
});</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</body>
</html>
？あなたのjQueryはロードされていないので、$は呼び出された時点では未定義です。 jquery参照リンクをボディの終了タグの直前に配置します。 –
@ damianocelentこれはそうではありません：私はこれがjQueryだと思っていました。私はすでにそれを持っています。 –
ええ、それはあなたのhtmlでどこに置いたのですか？