用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.");
        }
    }

});

DEMO - http://jsfiddle.net/uhYxf/

Answer 1

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

但是，另一个更容易的选项是在单击时将select的size属性更改为大于1的某个属性。这并没有给出相同的感觉，但可能符合您的需求。