从javascript函数打开下拉列表

Question

Iam试图在调用javascript函数时显示下拉选项.但最终我没有成功.需要帮助这是我的代码:

<script>
function showState(str){ 
$('#Acntname').trigger('click');

}
</script>
...
<select class="input_panel" id="Acntname" > 
<option value="0">Select</option>
<option value="1">Equity Share Capital</option>
<option value="2">Deprication Fund</option>  </select>

<input type="text" class="input_panel" id="accountname" onkeyup="showState(this.value)"/>

我使用触发功能打开下拉列表,但它不起作用.

Answer 1

在这里你去..你可以通过在下拉列表上发送mousedown事件来做到这一点.

演示小提琴

JS:

window.showState = function (str) {
    var dropdown = document.getElementById('Acntname');
    var event = document.createEvent('MouseEvents');
    event.initMouseEvent('mousedown', true, true, window);
    dropdown.dispatchEvent(event);
}

编辑:这在Chrome <53中完美运行,对Firefox和IE不确定.

Answer 2

toggle这是不可能drop down的triggering other element。

select box如果您想选择onkeyup event的值，textbox请尝试以下操作，

function showState(str){ 
   //  alert(str);
   $('#Acntname option[value="'+str+'"]').prop('selected',true);
}

演示