0

Squarespace と jQuery は初めてです。ヘッダーに挿入することでjQueryを実装しました。

H3 をクリックすると 2 つの段落のテキストが表示されるようにしようとしています。 

<script type="text/javascript"     
src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript"     
src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>

<script>
$(document).ready(function(){
$(".read-more").click(function(){
$(".bio-more").slideToggle();
});
});
</script>

<div class="read-more">
<h3>Read More</h3>
<div class="bio-more">
<p>some text</p>
<p>some text</p>
</div>
</div>

 .bio-more{
 display:none;
 }

my-accountsquarespace.com/whitney-oldenburg という URL からバックエンドからページを表示すると機能します (残念ながらログアウトすると、このページにアクセスできないようです)。

しかし、私がこのページを見ると： http://gitanarosa.com/artist/#/whitney-oldenburg/ 基本的に同じであるログインまたはログアウトのいずれかですが、Squarespaceが追加する上部に奇妙な引き伸ばされたサムネイルがありません。動作しません。

私のコードに何か問題がありますか？H3の代わりに「#」のアンカー要素を使ってみたのですが、違いはありませんでしたか? URL の # と何か関係がありますか?

それとも、これは Squarespace 固有の問題ですか?

ありがとう。

4

1 に答える 1

0

あなたのページを見ると、サムネイルをクリックすると「続きを読む」を含むブロックが動的に挿入されます。そのため、通常の jquery クリック ハンドラーは、動的に作成された要素に対しては機能しません。これを試して、

$('body').on("click",".read-more h3",function(){
$(".bio-more").slideToggle();
});
于 2014-01-18T06:11:13.253 に答える