javascript - 打开一个下拉菜单，在页面上的其他地方单击

我想打开这个下拉选择，不是点击它的位置，而是点击另一个<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/