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

Open a dropdown menu, clicking somewhere else on the page

本文关键字:其他 位置 下拉菜单 单击      更新时间:2023-09-26

我想打开这个下拉选择,不是通过单击它的位置,而是通过另一个<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
    });
});

可以这样做吗?

试试

  $(function () {
             $('#camDurationSpanId').click(function () {
                    $('#camDurationId').attr('size',5);
                });
            });

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

为了以编程方式打开select框,您需要触发一个mousedown事件:

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

这是一个演示。