初次點擊後，必須點擊兩次使用jquery點擊（）

-2

找不到實際工作的解決方案，但我希望點擊時，div顯示。現在這個工程當我加載頁面，但之後，第一次點擊，我不得不點擊兩次div顯示。初次點擊後，必須點擊兩次使用jquery點擊（）

任何想法？

$(document).ready(function() { 
    setMenu();  
}); 

function setMenu() 
{ 
    var headerExtIsOpen = false; 
    $('#headerExt').hide(); 

    $('#header').click(function() { 
     if (!headerExtIsOpen) { 
      $('#headerExt').show(); 
      headerExtIsOpen = true; 
     } else {  
      $('#headerExt').hide(); 
      headerExtIsOpen = false; 
     } 
    }); 
}

來源

2014-02-06 user2713516

它完美的作品：http://jsfiddle.net/8dCnh/ –

沒有必要記住狀態，只需使用切換（）

$(function() { 
    setMenu();  
}); 

function setMenu() 
{ 
    $('#headerExt').hide(); 

    $('#header').on("click", function (e) { 
     e.preventDefault(); 
     $('#headerExt').toggle(); 
    }); 
}

你說你想切換其他的東西。

最好的辦法是切換一個類來改變顏色

$('#header').on("click", function (e) { 
    e.preventDefault(); 
    $(this).toggleClass("open"); 
    $('#headerExt').toggle(); 
}); 

another way is to check the state 

$('#header').on("click", function (e) { 
    e.preventDefault(); 
    var child = $('#headerExt').toggle(); 
    var isOpen = child.is(":visibile"); 
    $(this).css("background-color" : isOpen ? "red" : "blue"); 
});

如果佈局是一樣的東西

<div class="portlet"> 
    <h2><a href="#">Header</a></h2> 
    <div> 
     <p>Content</p> 
    </div> 
</div>

你可以有這樣的

.portlet h2 { background-color: yellow; } 
.portlet > div { display: none; } 
.portlet.open h2 { background-color: green; } 
.portlet.open > div { display: block; }

CSS

而JavaScript

$(".portlet h2 a").on("click", function() { 
    $(this).closest(".portlet").toggleClass("open"); 
});

而且有佈局可能有零JavaScript參與。

來源

2014-02-06 14:07:16 epascarello

我也會稍後設置一些CSS屬性，所以切換將無法正常工作。 – user2713516

什麼屬性...切換可以工作。 – epascarello

當Ext打開時，標題本身的背景顏色。當Ext關閉時我再次恢復正常。所以我需要知道什麼時候它已經打開或沒有我想 – user2713516

原來，我的一些腳本隱藏在我的.js文件中，當用戶在其他地方點擊時我再次關閉菜單，我忘了。

function resetMenu(e) { 
    var container = $('#headerExt'); 

    if (!container.is(e.target) // if the target of the click isn't the container... 
     && container.has(e.target).length === 0) // ... nor a descendant of the container 
    { 
     $('#header').css("background-color", "inherit"); 
     container.hide(); 
     headerExtIsOpen = false; 
    } 
}

我忘了在此功能關閉之後再次設置headerExtIsOpen回false（上面的代碼示出了固定）。現在它工作正常:)

來源

2014-02-06 14:20:10 user2713516

初次點擊後，必須點擊兩次使用jquery點擊（）

回答

相關問題