Question

JQuery 切换 & 图像

2010-11-24

8523

javascript jquery

我有一个 + 图标和一个 - 图标。当有人点击 + 图标时，会出现一个框，图标会变为 - 图标。如果他们再次点击，框会消失，图标会变为 + 图标。

这是我尝试过的代码，但它不起作用...

$("#box").toggle(function(e){
        $("#icon").attr ("src","/images/icon_expand.png")
    },
    function(e) { 
        $("#icon").attr("src","/images/icon_retract.png")
    }
);

有什么想法吗？

谢谢！

Answer 1

.toggle() 函数将 click 处理程序附加到元素，而不是事件处理程序，当元素切换为可见时，应将其附加到 #icon ，如下所示：

$("#icon").toggle(function(){
  $("#box").hide();
  this.src = "/images/icon_expand.png";
}, function() { 
  $("#box").show();
  this.src = "/images/icon_retract.png";
});

Answer 2

$.togle () 切换匹配元素的可见性。所以你用错了。

你必须做这样的事情：

$( '#icon' ).click ( function () {
    var $this = $( this );
    var $box = $( '#box' );

    $box.toggle ();

    if ( $box.is ( ':visible' ) === true ) {
        $this.attr ( "src", "/images/icon_retract.png" );
    } else {
        $this.attr ( "src", "/images/icon_expand.png" );
    }
} );

Answer 3

我认为，昵称会进行更正，然后可以正常工作。
您必须首先显示框，然后在第二次点击时，您必须隐藏它，如果是这样，
然后尝试此

103597958