2

私は自分のサイトと次のコードで Bootstrap CSS および JS ライブラリを使用しています。

$(function(){
$("#nav-login-btn").click(function(){
    if($("#togglesection").not(":visible")) {
        $("#nav-login-btn").css({"background-color":"#fff", "color":"#222"});
        $("#togglesection").show();
    }
    else {
        $("#nav-login-btn").css({"background-color":"transparent", "color":"#fff"});
        $("#togglesection").hide();
    }
})
})
$(document).mouseup(function (e)
{
    if (!$("#togglesection").is(e.target) && $("#togglesection").has(e.target).length === 0)
    {
        $("#togglesection").hide();
        $("#nav-login-btn").css({"background-color":"transparent", "color":"#fff"});
    }
});

div が表示され、#nav-login-btnの css が変更されますが、もう一度ボタンを押すと、else ステートメントは実行されません。しかし、下のコードをクリックすると、div が非表示になります。何が問題ですか？

これがjsfiddleです：http://jsfiddle.net/Zmzk9

4

3 に答える 3

5

この文：

$("#togglesection").not(":visible")

常に「真実」である jQuery オブジェクトを返します。

あなたはこれを求めている：

if (!$("#togglesection").is(":visible")) {

is()「これらの要素の少なくとも1つが指定された引数と一致する場合」にブール値を返します。

あなたのフィドルに応じて編集してください..これを試してください：

http://jsfiddle.net/XsLNJ/

ボックスを非表示にしたトリガー、次にmouseupボックスを表示したトリガー。click

于 2013-08-29T15:24:45.827 に答える
1

試すif(!$("#togglesection").is(":visible")) {

詳細については、この jsFiddleを参照してください...

console.log($("#togglesection").is(":visible"));コンソールでは、ブール値をconsole.log($("#togglesection").not(":visible"));返し、実際のオブジェクトを返すことに気付くでしょう。

于 2013-08-29T15:24:18.147 に答える