Question

我在<p> tag和如果Iclick。 <代码>mg or the <p>, 它需要toggled<>/code> and the img should changed。



I have done it by adding   jQuery(this).attr("src", "img/hide.png"); but the img is not changing can any one suggest me the right path.

这里是我的文字:

<script type="text/javascript">
    jQuery(document).ready(function () {
        jQuery(".content").hide();
        //toggle the componenet with class msg_body
        jQuery(".heading").click(function () {
            jQuery(this).next(".content").slideToggle(500);
        });
      });
</script>


这是我的安保部:

.layer1 {
margin: -5px;
padding: 0px;
width: 860px;
}


这是我的标志:

<div class="layer1">
<p class="heading"><img src="img/show.png" alt="" style="margin:0 5px 0 0;" /></p>
<div class="content"></div>
<p class="heading"><img src="img/show.png" alt="" style="margin:0 5px 0 0;" /></p>
<div class="content"></div>
<p class="heading"><img src="img/show.png" alt="" style="margin:0 5px 0 0;" /></p>
<div class="content"></div>
<p class="heading"><img src="img/show.png" alt="" style="margin:0 5px 0 0;" /></p>
<div class="content"></div>
<p class="heading"><img src="img/show.png" alt="" style="margin:0 5px 0 0;" /></p>
<div class="content"></div>
</div>

Answer 1

j Query (this).attr ("src”, “img/hide.png”;

In this context this will refer to the .heading (the p tag). You ll have to dig down a little deeper to reference the image:

jQuery (this).find ( img ).attr (“src”、“img/hide.png”);

这里是一片 j,显示:

http://jsfiddle.net/jonathon/yBFWM/

<><>Edit>/strong> 我错过了这个问题的细列。

我增加了一条轨道,以便了解活性内容领域是什么。然后,当你点击图像时,它将掩盖活性内容领域,显示现状。我还补充说,如果点击手已经选定,那么点击手就能够 to取内容。

jQuery(".heading").click(function() {
    var $this = $(this),
        $contentArea = $this.next( .content );

    if (!$contentArea.hasClass( active )) {
        $(".content.active").slideToggle(500).removeClass( active );
        $contentArea.slideToggle(500).addClass("active");

        $this.find( img ).attr("src", "http://www.google.com/images/icons/ui/doodle_plus/doodle_plus_google_logo_on_grey.gif");
    }
});

Answer 2

$("p").mousedown(function(){
    $(this).find( img ).attr( src , img/img1.png );
})

$("p").mouseup(function(){
    $(this).find( img ).attr( src , img/img2.png );
})

$("img").mousedown(function(){
    $(this).attr( src , img/img1.png );
})

$("img").mouseup(function(){
    $(this).attr( src , img/img2.png );
})

Answer 3

贵国在<条码>jQuery(标题)click(界定的点-handler中是否列入“条码”栏目。在这种情况下,你的代码不能奏效,因为this系指<pqu=“heading”>,而不是图像。

简单地改变行文

jQuery( img ,this).attr("src", "img/show.png")

Answer 4

<script type="text/javascript">
    jQuery(document).ready(function () {
        var imgShow =  img/show.png ;
        var imgHide =  img/hide.png ;
        jQuery(".content").hide();
        //toggle the componenet with class msg_body
        jQuery(".heading").click(function () {
            jQuery(this).next(".content").slideToggle(500);
            if (JQuery(this).find("img").attr( src ) == imgShow ) {
                JQuery(this).find("img").attr( src , imgHide);
            } else {
                JQuery(this).find("img").attr( src ,imgShow);
            }
        });
      });
</script>

友情链接