用href關閉疊加層

我有一個導航疊加層，我想要做的是在單擊鏈接時關閉導航。它適用於href="#"，但我的鏈接是href="someplace.com"。我怎樣才能讓鏈接關閉我的div，同時仍然使用href？用href關閉疊加層

`<script> 
$(document).ready(function(){ 
$(".menu-wrapper a").click(function(){ 
$(".overlay").fadeToggle(200); 
$(this).toggleClass('btn-open').toggleClass('btn-close'); 
}); 
}); 
$('.overlay').on('click', function(){ 
$(".overlay").fadeToggle(200); 
$(".menu-wrapper a").toggleClass('btn-open').toggleClass('btn-close'); 
open = false; 
}); 
</script>`

和鏈接是

`<li><a class="btn-close" href="<?php echo SITE_URL; ?>profiles">Profiles</a></li>`

感謝您的幫助。

來源

2017-07-20 Nick Galgay

如果鏈接有href =「＃」頁面沒有得到重載，否則會。你可以這樣做：

<li><a class="btn-close" href="javascript:void(0)" onclick="closeOverlay()">Profiles</a></li>

然後寫一個函數

function closeOverlay() {...}

，你將關閉覆蓋，並調用AJAX讓你的PHP數據

來源

2017-07-20 00:58:01

我jQuery是生鏽

$('.some-class-for-all-nav-links').click(function() { 
// select the nav and close it with css or javascript 
})

來源

2017-07-20 01:00:07 arodjabel

瀏覽器中的事件會逐級下降然後上升。假設你有以下結構：

<html> 
    <head>...</head> 
    <body> 
    <section> 
     <p>Here is a <a href="#sample">link</a></p> 
    </section> 
    </body> 
</html>

當你點擊鏈接時，click事件被髮送到綁定到這個順序元素的任何事件偵聽器：window, html, body, section, p, a, a, p, section, body, html, window。當事件從上到下（捕獲時）或從下到上（冒泡）時，事件是否發生是通過調用addEventListener調用onCapture布爾參數來確定的。

您可以將事件綁定到捕獲時觸發的HTML文檔，檢查用戶是否單擊了鏈接，如果是，請關閉導航欄或任何您想要執行的操作。我不認爲jquery支持事件捕獲，你必須做到這一點香草風格。

下面是我的示範示例中的一些JS。這會爲整個文檔添加一個事件監聽器，當檢測到單擊時將觸發該文檔。然後它檢查被點擊的東西實際上是一個鏈接（<a>元素）。

document.addEventListener('click', function (e) { 
    if (e.target.tagName === 'A') { 
    alert("You've just clicked a link"); 
    } 
}, true); // true to trigger on 'capture'

https://jsfiddle.net/gf9drum2/

來源

2017-07-20 01:29:59

我感謝您的反饋意見，但是我沒有實現你的建議是什麼需要jquery的技能。感謝你的寶貴時間。 –

@NickGalgay這不是jquery，而是你需要的香草JS。因爲我的心情很好，所以我會用實際的代碼編輯答案:) –

用href關閉疊加層

回答

相關問題