Question

我想打开此下拉列表选项，而不是点击它的位置，而是点击另一个<span>。

以下是下拉菜单：

<div class="styled-select">
    <span id="camDurationSpanId" style="font-size:18px; position: absolute; top:8px; width:305px; height :42px;"></span>
    <select id="camDurationId" name="camDuration" style="margin:42px 0 0 5px; border: none" onmousedown="{this.size=this.options.length;} " onchange='this.size=0;' onblur="this.size=0;">
        <option value="0">All Duration</option>
        <option value="1">Last Month</option>
        <option value="2">Last Two Weeks</option>
        <option value="3">Last Week</option>
        <option value="4">Custom</option>
    </select>
</div>

我想通过点击<span id="camDurationSpanId">打开下拉菜单，同时，我想将所选选项放入此范围内。

这是我的javascript：

$(function() {
    $('#camDurationSpanId').click(function() {
        $('#camDurationId'). //don't know what to write here

    });
});

是否可以这样做？

Answer 1

试

{{1}}

示例：https://jsfiddle.net/cmedina/o7zn8f8h/

Answer 2

要以编程方式打开select框，您需要触发mousedown事件：

$('#camDurationId').trigger('mousedown');

Here's a demo

打开下拉菜单，单击页面上的其他位置

2 个答案: