javascript - 在android上的样式选择上触发默认事件

Question

我在选择框上有一个自定义包装器。当我单击它时，我想显示来自 android 的本机选择。我尝试在隐藏的选择上触发“焦点”、“单击”和“鼠标输入”，但这些选项都不起作用。

Answer 1

好的，所以我在经过大量修改后创建了一个小提琴并且它起作用了（结果只是 webkit）。如果有人提出更好的解决方案，将不胜感激。

HTML

<button id="clickme" value="click me!">Click me!</button>
<select id="select">
    <option>Default</option>
    <option value="1">1</option>
    <option value="2">2</option>
</select>

jQuery

var clickme = jQuery("#clickme"),
    select = jQuery("#select");
clickme.on("mousedown", function (e) {
    proxyMouseEvent(e, select[0]);
});
clickme.on("click", function (e) {
    proxyMouseEvent(e, select[0]);
});
function proxyMouseEvent(event, element) {
    var evt = document.createEvent("MouseEvents");
    evt.initMouseEvent(event.type, event.bubbles, event.cancelable, window,
        0, 0, 0, 0, 0, false, false, false, false, 0, null);
    element.dispatchEvent(evt);
}

jsFiddle

基本上，我从按钮中捕获事件，复制它并将其发送到选择。当 select 检测到自身的 mousedown 事件时，它会触发其默认行为（在桌面操作系统中显示下拉列表，而在移动设备中显示覆盖列表）