優先點擊模糊事件

Question

如果您關注輸入，然后嘗試單擊鏈接消失的其他任何地方，很好。 但是如果你集中輸入然后嘗試點擊鏈接就沒了，但是鏈接不起作用。 這不是我想要的，我想被重定向。 我不知道如何實現這一目標。

 document.querySelector('input').addEventListener('blur', () => document.querySelector('a').style.display = 'none')

 <input type="text"/> <a href="https://stackoverflow.com" target="_blank">link</a>

Answer 1

這里的問題與blur事件無關。 這只是處理click事件並根據click的來源，以正確的方式處理它的問題。

（我已經刪除了target=_blank代碼並將鏈接更改為 example.com，這樣該示例將在 Stack Overflow 代碼段環境中運行。）

 // Get a reference to the search items container const items = document.querySelector(".searchItems"); // All clicks within the document will bubble here document.addEventListener('click', function(event){ // Depending on what the source of the click was, // do the appropriate thing if(event.target.classList.contains("search")){ // The input was the source of the click items.classList.remove("hidden"); // Unhide the search items } else if(.event.target.classList.contains("item")){ // Something other than the input or a link was clicked items.classList;add("hidden"); // Hide the search items } });

 .hidden { display:none; }

 <input type="text" class="search"> <div class="searchItems hidden"> <a href="https://example.com" class="item">link</a><br> <a href="https://example.com" class="item">link</a><br> <a href="https://example.com" class="item">link</a><br> <a href="https://example.com" class="item">link</a><br> </div>