Jquery隐藏和显示基于索引,方式?

时间:2012-02-15 13:26:11

标签: jquery indexing toggle show-hide

我正试图让div显示并隐藏在点击上。 目前,名为#MAIN (1)的主要div应该是默认的。所以当我点击框时,主div再次出现。

我已经更新了FIDDLE,我现在应该在我点击容器后将数字1设为默认值 例如 http://jsfiddle.net/srg6g/480/

1 个答案:

答案 0 :(得分:1)

我想我终于明白了你的所作所为。

你想要的是在文档上绑定点击事件,所以当用户点击“数字”之外时,会再次显示#MAIN:

$('html').click(function() {
    // use :not() to avoid fading when #MAIN is the current
    $(".hotspot_bub:not(#MAIN)").fadeOut('slow');
    $("#MAIN").show();
});

点击热点时停止传播:

$("#MAIN").show();
$('a.a_hotspot').click(function(e) {
    e.preventDefault();

    // so the click handler on "html" is not executed
    // when clicking on a hotspot
    e.stopPropagation(); 

    $(".hotspot_bub").fadeOut('slow');
    $(this).next().fadeIn('slow');
});

<强> DEMO