0

jQuery経由でクリックイベントを作成しようとしています

ここにHTMLコードがあります

<div class="wpcart_gallery" style="text-align:center; padding-top:5px;">

<a class="thickbox cboxElement"  href="0037.jpg" rev=" 0037.jpg">
<img class="attachment-gold-thumbnails colorbox-736" width="50" height="50" src="0037-50x50.jpg">
</a>

<a class="thickbox cboxElement"  href="0038.jpg" rev=" 0038.jpg">
<img class="attachment-gold-thumbnails colorbox-736" width="50" height="50" src="0038-50x50.jpg">
</a>

<a class="thickbox cboxElement"  href="0039.jpg" rev=" 0039.jpg">
<img class="attachment-gold-thumbnails colorbox-736" width="50" height="50" src="0039-50x50.jpg">
</a>

</div>

画像リンクのクラス名は、thickbox cboxElement と呼ばれることに注意してください。ページが読み込まれると、クラス cboxElement が div 内の最初の画像から削除されます。ユーザーがいずれかの画像をクリックして、その画像リンクからクラス名 cboxElement を削除し、クラス cboxElement を他の画像リンク。

<script type="text/javascript">
    jQuery('document').ready(function($){
         $(".wpcart_gallery a:first").removeClass("cboxElement");
         jQuery(".wpcart_gallery img").click(function($){
             jQuery(".wpcart_gallery a").removeClass('cboxElement').siblings().addClass('cboxElement');
        });
    });
</script>

上記のコードは機能します…ちょっと。最初の画像リンクからクラス名 cboxElement を削除しますが、クリック イベントが機能しません。画像をクリックすると、すべての画像リンクにクラス cboxElement が追加されます。

私が探しているのは、クリックされたものを除くすべての画像リンクにクラス cboxElement を追加することです。

jQueryコードのエラーコンソールにエラーはありません.jquery.jsファイルはヘッダーにあり、機能しています。

ここに例があります...大きな画像の下にある 3 つの画像に注目してください。http://www.taranmarlowjewelry.com/products-page/rings/product-1-2/

4

2 に答える 2

2

あなたがするとき

 jQuery(".wpcart_gallery a")

クリックしたタグではなく、div 内のすべてのタグのリストを取得します。したがって、最初にクラスを削除してからすべての兄弟に追加すると、次のようになります。

  1. すべてのタグからクラスを削除します
  2. クラスをすべてのタグに追加する

クリックされた画像に属する a を取得するには、次のようにします。

jQuery(this).closest('a')

これがうまくいくことを願っています！

于 2012-09-18T07:04:07.023 に答える
0

関数の引数から $ を削除します

jQuery(".wpcart_gallery img").click(function(){
             jQuery(".wpcart_gallery a").removeClass('cboxElement').siblings().addClass('cboxElement');
        });
于 2012-09-18T07:02:44.463 に答える