no-image

點擊按鈕,文本框如何不失去焦點

                                    

給按鈕設置 mousedown 事件,並在其中 event.preventDefault() 就可以瞭

// html
<input type="text" autofocus="autofocus">
<button>點擊我文本輸入框不會失去焦點</button>

// javascript
var btn = document.querySelector('button')
btn.onmousedown = function(event) {event.preventDefault()}

要點擊按鈕,觸發按鈕的 click 事件,但又不想觸發 input 的 blur 事件。 這裡面的問題就在於,當我們點擊按鈕的時候,文本框失焦,這是瀏覽器的默認事件。當你點擊按鈕的時候,會觸發按鈕的 mousedown 事件,mousedown 事件的默認行為是使除瞭你點擊的對象之外的有焦點的對象失去焦點。所以隻要在 mousedown 事件中阻止默認事件發生就可以瞭!

關聯文章