解除累积

Question

http://jsfiddle.net/HT9Bx/426/ === 我的日历（这里用 b1 b2 b3 总结），还有一个 Youtube Player。我希望事件取代 Youtube 播放器（youtube 显示：none）。所以我在 youtube 和事件上使用了一个开关。但是当用户点击事件 1 和事件 2 之后，都会出现 !

<div id="youtubeEmbed" class="youtubeEmbed"></div>

<div id="event1"></div>
<div id="event2"></div>
<div id="event3"></div>

<div id="b1" class="b"></div>
<div id="b2"class="b"></div>
<div id="b3"class="b"></div>

.youtubeEmbed {   width:100px;   height:75px;    background-color:red;}

.b{    width:20px;    height:5px;    background-color:black;     margin:20px;}

#event1 {       width:100px;   height:75px;    background-color:blue;    display:none;}
#event2 {       width:100px;   height:75px;    background-color:blue;    display:none;}
#event3 {       width:100px;   height:75px;    background-color:blue;    display:none;}


$( "#b1" ).click(function() {
    $(".youtubeEmbed").toggle();
    $("#event1").toggle();
});

$( "#b2" ).click(function() {
    $(".youtubeEmbed").toggle();
    $("#event2").toggle();
});

$( "#b3" ).click(function() {
    $(".youtubeEmbed").toggle();
    $("#event3").toggle();
});

Answer 1

您确实需要付出更多努力来解释这个问题，但首先，请尝试以下示例：

$( '.b' ).on( 'click', function() {
    $( 'div.event' ).not( 'div#' + $( this ).data( 'toggle' ) ).hide();
    $( 'div#' + $( this ).data( 'toggle' ) ).toggle();  
});

FIDDLE

编辑

这是另一个尝试。事件将在 select "replace" youtubeEmbed div，如果没有事件 select 将显示 youtubeEmbed。

$( '.b' ).on( 'click', function() {
    $( 'div.event' ).not( 'div#' + $( this ).data( 'toggle' ) ).hide();
    $( 'div#' + $( this ).data( 'toggle' ) ).toggle();
    $( 'div.event:visible' ).length ? $( '#youtubeEmbed').hide() : $( '#youtubeEmbed').show();
});

FIDDLE

Answer 2

我不确定您要求什么，因为您的 ID 和类与您的代码不匹配，但为了使用 JQuery 对 CSS 进行更改，请使用。 css();方法，示例：

$("#id").css("display", "none");

解除累积

Untoggle Accumulation

html

javascript

css

toggle