javascript-jQuery Noobish帮助：Img OnClick

我是JQuery的新手,在了解如何执行此操作时遇到了一些麻烦：

我有一个“ imgexpander”类的图像,其src属性设置为“ img1.png”.单击该图像时,它应查看当前是否隐藏或可见具有“ expand”类的div.

>如果它是隐藏的(默认设置),它将显示它(我知道如何使用show()),并将图像的src属性更改为“ img2.png”.

要么：

>如果div可见,则将其隐藏,并将图像的src属性更改为“ img1.png”.

我还不熟悉JQuery中的可用功能.如何做到这一点？您能给我一些我可以使用的示例代码吗？

提前致谢！

更新：我忘了添加一个细节：是否有可能使“ imgexpander”类的图像的onclick仅影响全部包含在一个大div中的div？因此,层次结构将类似于：

>大股利

>带有onclick的图片
>需要受到影响的div

>另一个大股利

>带有onclick的图片
>需要受到影响的div

期望的结果是使每个“带有onclick的图像”仅影响其各自“大div”内的“需要受到影响的div”.这可能吗？我不确定当前答案是否合适,但谢谢！

解决方法:

怎么样：

$("img.imgexpander").click
(
  function()
  {        
    var expandableDIVs = $(this)
                           .parents("div.bigdiv:first")
                           .find("div.expand");    
    expandableDIVs.toggle();
    this.src = expandableDIVs.is(":visible") ? "img2.png" : "img1.png";
  }
);

此代码为imgexpander类的所有IMG元素设置了click事件处理程序.处理程序切换类扩展的所有DIV元素的可见性.通过测试是否可以看到与“ div.expand”匹配的任何DIV元素来更新图像的src属性.

注意,我可以将与“ div.expand”选择器匹配的jQuery包装的DIV集分配给JavaScript变量,以供以后使用.

事件处理程序中的this关键字引用由“ img.imgexpander”选择器匹配的当前DOM元素.请记住,此表达式可以匹配多个元素.

编辑：获取div.expand元素的方法已更新,以反映对OP所做的更改.单击img时,将仅切换作为父bigdiv类别DIV的子级的DIV元素.

注意,已经注意忽略元素标记的方式.对我们来说很重要的是,IMG元素在其bigdiv类的父链中的某个位置具有父DIV,但是该元素不必是直接父.这就是我使用：first伪选择器的原因.