Question

如何动态触发选择下拉列表以打开值，除了将属性值更改为选项值的长度。我想以任何方式动态触发选择下拉列表（向右箭头）？

HTML:

      <div>
        <input type="text" />
      </div>
      <div>
        <select id="testSelect" onfocus="openDrpDown(this)" onblur="closeDrpDown(this)">
            <option>11111</option>
            <option>222222</option>
            <option>444444444</option>
            <option>55555</option>
        </select>
      </div>

Script:
function openDrpDown(){
    //var myDropDown=$("#testSelect");
    //var length = $('#testSelect > option').length;
    //open dropdown
    //myDropDown.attr('size',length);
    $("#testSelect").click();
}

function closeDrpDown(){
    //var myDropDown=$("#testSelect");
    //var length = $('#testSelect > option').length;
    //close dropdown
    //myDropDown.attr('size',0);
}

Answer 1

您可以为此选择框data-selectSize设置两个属性，这是两个选项，size＆amp;选项的长度。我们将更新此size onfocus＆amp; onblur。

此外，我们还需要tabindex来指示元素是否可以获得输入焦点。

  function openDrpDown(elem) {
   $(elem).attr("size", $(elem).attr("data-selectSize"));
    var options = "select[tabindex='" + +$(elem).attr('tabindex') + 1 + "']";

    $(options).fadeTo(50, 0);
  };


function closeDrpDown(elem) {
    $(elem).attr("size", 1);
    var options = "select[tabindex='" + +$(elem).attr('tabindex') + 1 + "']";
    $(options).fadeTo('fast', 1.0);
  };

JSFIDDLE

Answer 2

  function tr_click(){
     $("#testSelect").trigger("click");
}

在您想要的地方拨打电话，如果您想在页面加载时打开它，请通过正文标记<body onload="tr_click()"></body>

进行调用

如何动态触发选择下拉列表

2 个答案: