javascript - 用javascript打开selectBox元素？

Question

你能帮助我吗？我想用 JS 打开一个选择框。但它在 Firefox 中不起作用。不知道哪位大神帮我解决一下？

<select id="selId" class="pos_fixed">
 <option value="volvo">Option1</option>
 <option value="saab">Option2</option>
 <option value="mercedes">Option3</option>
 <option value="audi">Option4</option>
 </select>
<span class ="xxx">open</span>

jQuery(document).ready(function($) {

    $(".xxx").on('click', function () {
        openSelect($('#selId'));
    });


    var openSelect = function(selector){
        var element = selector[0], worked = false;
        if (document.createEvent) { // all browsers
            var e = document.createEvent("MouseEvents");
            e.initMouseEvent("mousedown", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
            worked = element.dispatchEvent(e);
        } else if (element.fireEvent) { // ie
            worked = element.fireEvent("onmousedown");
        }
        if (!worked) { // unknown browser / error
            alert("It didn't worked in your browser.");
        }
    }

});

演示 - http://jsfiddle.net/uhYxf/

Answer 1

您将很难执行此跨浏览器。我会选择使用select2或Chosen之类的选择框插件，而不是使用 html<select>元素。

但是，另一个更容易的选项是size在单击时将 select 的属性更改为大于 1。这不会给人同样的感觉，但可能会满足您的需求。