按下按鈕時如何使元素不失去焦點？

Question

我有一個 textarea，我在插入符號的位置插入內容（感謝Tim Down 的回答）。 它在用戶按下按鈕時插入內容。 但似乎按下按鈕時，textarea 上的焦點丟失了。 如果插入符號的位置也相同，我如何將焦點保持在那里？ 我正在考慮將evt.preventDefault()與.focusout() 。 如果那有幫助。

Answer 1

沒有必要更新焦點！

確保您處理 mousedown 事件（而不是單擊事件）。 mousedown 事件將在另一個元素的焦點丟失之前觸發。

在您的mousedown事件處理程序中，您需要防止事件默認行為。

e.preventDefault(); // on your mousedown event

JS-Fiddle 演示

Answer 2

您無法阻止焦點移動到可聚焦元素，並且仍然允許鼠標單擊具有其正常行為（例如click按鈕）。 如果單擊支持焦點的元素（例如按鈕），它將獲得鍵盤焦點。

如果操作得當，可以以編程方式將焦點重新放在元素上。 如果做得不好，它可能會破壞頁面的可用性。

演示： JSFiddle

Answer 3

按下按鈕時，您必須更新焦點。

HTML代碼：

<input id="messageBox" autofocus />
<input type="button" id="messageSend" onclick="setFocusToMessageBox()" value="Send" />

Javascript代碼：

<script>
function setFocusToMessageBox(){
    document.getElementById("messageBox").focus();
}
</script>

Answer 4

您可以通過在按鈕單擊功能結束時以編程方式將焦點重新應用到文本區域來輕松完成此操作。 通過這種方式，您可以在每次單擊事件的同時重新獲得焦點。