2012-02-14 77 views
9

「#business」當前設置爲後臺:#323232;我如何將其更改爲#000;當我點擊「#商業」並返回到323232菜單關閉後?如何使用jquery使用此代碼更改css屬性

$(document).ready(function() { 

    $("#business").click(function(){ 
     jQuery.fx.off = true; 
     $("#businessmenu").toggle(""); 
    }); 

    $('html').click(function() { 
     $("#businessmenu").hide(""); 
    }); 

    $('#business').click(function(event){ 
     event.stopPropagation(); 
    }); 

}); 

下面是HTML:

<a href="#" id="business">Biz name</a> 
<div id="businessmenu"> 
    <a href="help.html">Help</a> 
</div> 

回答

28

可以使用css方法更改CSS屬性(或多個屬性如果有必要):

$("#business").click(function(event){ 
    jQuery.fx.off = true; 
    $("#businessmenu").toggle(""); 
    $(this).css("background-color", "#000"); 
    event.stopPropagation(); 
}); 
$('html').click(function() { 
    $("#businessmenu").hide(); 
    $("#business").css("background-color", "#323232"); 
}); 

請注意,我結合你綁定到#business的2個事件監聽器,因爲它只是綁定一個沒有區別。

作爲一個方面說明,是否有一個原因,你傳遞一個空字符串hide?這不應該是必要的。

+0

工作正常,有1個例外..它沒有返回到#商業#323232? – Josh 2012-02-14 23:10:20

+0

@Josh - 啊,看我的編輯。我讓它在'#businessmenu'而不是'#business'上設置CSS屬性。 – 2012-02-14 23:16:40

+0

你是男人,謝謝:) – Josh 2012-02-14 23:18:44

1

css函數用於更改背景等CSS屬性。

$('html').click(function() { 
    $('#businessmenu').hide(""); 
    $('#busniessmenu').css('background-color', '#323232'); 
}); 

$('#business').click(function(event){ 
    event.stopPropagation(); 
    $(this).css('background-color', '#000'); 
}); 
3

如果你想(「#business」你的情況)更改元素的背景顏色,你只需要做:

$("#business").css({ 
    "background": "#000" 
}); 

但我不知道你是什麼意思「菜單」,你應該向我們展示你的HTML代碼!

+0

我把上面的html ..基本上你點擊#business,它顯示「#businessmenu」 – Josh 2012-02-14 23:13:55