Как вызвать событие фокуса в текстовом поле с помощью javascript?
Например, в jQuery мы можем инициировать событие фокуса с помощью $('#textBox').focus()
.
Точно так же у нас есть какие-либо аналогичные функции триггера в чистом javascript?
Как вызвать событие фокуса в текстовом поле с помощью javascript?
Например, в jQuery мы можем инициировать событие фокуса с помощью $('#textBox').focus()
.
Точно так же у нас есть какие-либо аналогичные функции триггера в чистом javascript?
В конце концов мне пришлось возиться с этим, и я придумал что-то, что, похоже, работает в кросс-браузере:
function triggerFocus(element) {
var eventType = "onfocusin" in element ? "focusin" : "focus",
bubbles = "onfocusin" in element,
event;
if ("createEvent" in document) {
event = document.createEvent("Event");
event.initEvent(eventType, bubbles, true);
}
else if ("Event" in window) {
event = new Event(eventType, { bubbles: bubbles, cancelable: true });
}
element.focus();
element.dispatchEvent(event);
}
При этом учитывается, что некоторые браузеры поддерживают события focusin
, а некоторые поддерживают только события focus
. Он устанавливает фокус с помощью встроенной функции focus
, а затем отправляет событие focusin или focus, в зависимости от того, что поддерживает браузер.
Протестировано в:
И использовать его:
var foo = document.getElementById("foo");
triggerFocus(foo);
Это универсально и должно работать с любым элементом, который может получить фокус.
element
.
- person Greg Burghardt; 26.11.2019
Да, это возможно с помощью element.focus()
document.getElementById("textBox").focus();
function myFunction(x) {
x.style.background = "yellow";
}
function focusText() {
document.getElementById("textBox").focus();
}
Enter your name: <input type="text" id="textBox" onfocus="myFunction(this)">
<p>When the input field gets focus, a function is triggered which changes the background-color.</p>
<button onclick="focusText()">Focus the Textbox</button>
myFunction()
, который является прослушивателем текстового поля onfocus?
- person Ankit Chaudhary; 20.05.2020
focus
устанавливает фокус на элемент, но не вызывает события focus или focusin. Представьте, если onfocus снова устанавливает фокус на тот же элемент, который запускает событие focus, которое выполняет onfocus, который запускает событие focus... было бы легко создать рекурсивный вызов функции.
- person Greg Burghardt; 21.05.2020
Очень просто: Element.focus()
Это не вызовет событие onfocus См. ответ Грега, если это необходимо.
https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/focus
Element.focus()
не вызывает onfocus
событий, по крайней мере, в моем тестировании. метод dispatchEvent
, предложенный Грегом, подходит.
- person Ruben Martinez Jr.; 20.05.2020