javascript - 如何测试浏览器对事件的支持

Question

具体来说，测试是否input[type=date]会触发input事件？

Answer 1

jsFiddle 示例

你可以这样做：

 var element = document.getElementById('myElement');
 var supported = 'oninput' in element;

Answer 2

通过查看此网站，我建议您尝试

测试 B：在输入上使用 setAttribute 设置 oninput 并检查 node.oninput 是否是函数测试 C：使用 w3 事件 api 创建输入并伪造按键以查看 oninput 是否触发

这是来自测试 C 的 JavaScript

function testC(){
    var input = document.createElement('input'),
        e = document.createEvent("KeyboardEvent");
    // set type for DATE
    input.setAttribute('type', 'date');
    e.initKeyEvent("keypress", true, true, window, false, false, false, false, 0, "e".charCodeAt(0));
    // use initKeyboardEvent for webkit
    document.body.appendChild(input);
    input.addEventListener("input", function(e) { alert('C Successful'); e.preventDefault(); e.stopPropagation(); }, false);
    input.focus();
    input.dispatchEvent(e);
    document.body.removeChild(input);
}

---

编辑：测试代码是从测试页面复制的，只有几个小的更改（var 的位置、type=date、alert）。我刚才在 chrome 中运行它（更改initKeyEvent为之后initKeyboardEvent）并且它没有产生任何结果，但是注释掉该removeChild行并手动执行它会导致成功消息。不确定为什么模拟事件没有调用它，因此您需要先查看它，然后再将其应用到您的代码中。