javascript - 刷新 select2 下拉列表

Question

我正在尝试动态更改 select2 下拉菜单的选项。

我搜索了论坛并设法更改了所选选项，但只有在单击下拉菜单并查看整个列表时它才可见。提前为不是最好的编码员道歉。

function changeSelectOption(designSelVal) //designSelVal = 9

{   
    var opts = document.getElementById("design").options;
    for (var opt, i = 0; opt = opts[i]; i++) 
    {
    if (opt.value == design) 
        {
            document.getElementById("design").selectedIndex = i;
            break;
        }
    }
}

/* 这表明已从值 2 正确更改为 9 */

<option value="2" >Text Only</option>
<option value="4" >Heart Arrow</option>
<option value="9" selected>Heart</option>

可见的选项仍然是 'Text Only' 而不是 'Heart'，就好像选择框需要刷新一样。

Answer 1

您缺少 if 条件:

应该是

if (opt.value == designSelVal)

function changeSelectOption(designSelVal) //designSelVal = 9

    {
     
      var opts = document.getElementById("design").options;
      
      for (var opt, i = 0; opt = opts[i]; i++) {
        
        if (opt.value == designSelVal) {
          document.getElementById("design").selectedIndex = i;

          break;
        } 
      }
    }

    changeSelectOption(9);

    <select id="design">
      <option value="2" selected>Text Only</option>
      <option value="4">Heart Arrow</option>
      <option value="9" >Heart</option>
    </select>