jQuery单击功能无法正常工作

时间:2012-09-18 06:53:45

标签: jquery wordpress syntax click

我正在尝试通过jQuery创建一个click事件

这是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>

上面的代码有效... sorta。它从第一个图像链接中删除了类名cboxElement,但是click事件不起作用,当我转到点击任何图像时,它将类cboxElement添加到所有图像链接。

我要做的是将类cboxElement添加到除了点击的图像链接之外的所有图像链接。

我的错误控制台中没有jQuery代码的错误,jquery.js文件位于标题中并且正在运行。

这是一个例子......注意大图像下方的3张图像。 http://www.taranmarlowjewelry.com/products-page/rings/product-1-2/

2 个答案:

答案 0 :(得分:2)

当你做

 jQuery(".wpcart_gallery a")

您将获得div中所有标记的列表,而不是您单击的标记。因此,当第一次删除该类然后将其添加到所有兄弟姐妹时意味着:

  1. 从所有代码中删除课程
  2. 将课程添加到所有代码
  3. 要获取属于所单击图像的属性,请执行以下操作:

    jQuery(this).closest('a')
    

    希望这有效!

答案 1 :(得分:0)

从函数参数

中删除$
jQuery(".wpcart_gallery img").click(function(){
             jQuery(".wpcart_gallery a").removeClass('cboxElement').siblings().addClass('cboxElement');
        });