触发事件

一些元素提供特定方法来触发事件。

例如，要触发任何元素上的click事件，可以使用click()方法

el.click();Code language: CSS (css)

输入文本和文本区域元素提供focus()和blur()方法来触发focus和blur事件

el.focus();
el.blur();Code language: CSS (css)

表单元素具有submit()和reset()方法来触发submit和reset事件

const frm = document.querySelector('form');
// trigger the submit event
frm.submit();

// trigger the reset event
frm.reset();
Code language: JavaScript (javascript)

要触发其他事件，例如mousedown或change，可以使用以下triggerEvent()辅助函数

function triggerEvent(el, type) {
    // IE9+ and other modern browsers
    if ('createEvent' in document) {
        var e = document.createEvent('HTMLEvents');
        e.initEvent(type, false, true);
        el.dispatchEvent(e);
    } else {
        // IE8
        var e = document.createEventObject();
        e.eventType = type;
        el.fireEvent('on' + e.eventType, e);
    }
}Code language: JavaScript (javascript)

假设你有一个输入文本

<input type="text" name="username">Code language: HTML, XML (xml)

以下将事件处理程序绑定到click事件

const input = document.querySelector('input[type="text"]');
input.addEventListener('change', (e) => {
    console.log('Input changed');
});Code language: JavaScript (javascript)

要触发change事件，可以使用triggerEvent()函数，如下所示

triggerEvent(input, 'change');Code language: JavaScript (javascript)