Question

我想在多下拉菜单中添加新选项。不幸的是，新添加的选项没有显示出来。只有在选择下拉菜单中的选项后，它们才会出现。

那是我的代码：

<html lang="en">
<head>
   <title>Bootstrap Example</title>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <script src="https://code.jquery.com/jquery-2.1.3.js"></script>
   <link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
   <script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
</head>
    <body>
        <div class="col-12 col-md-8">
          <label id="highway_label" for="highway_dropdown"></label>
          <select id="highway_dropdown" multiple data-native-menu="false">
            <option>highway</option>
            <option>highway</option>
           </select>
        </div>
    </body>
</html>

如果你现在这样做了jquery：$("#highway_dropdown").append("<option>Test1</option>");

新选项“Test1”仅在您选择“高速公路”选项后才会显示。

以下是我的示例代码：https://jsfiddle.net/uzkbsevf/28/

Answer 1

我找到了解决方案！

所以问题是jquery.com/mobile中存在一个错误。

Answer 2

看起来它与jQuery Mobile重新创建下拉列表有关。当您检查代码时，您的Test1元素正确显示，它不是<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <button class="clone-button">clone button</button> <button class="destroy-button">destroy button</button> <div class="container"> <div id="app">test</div> </div> jQuery Mobile创建的一部分。

使用此选项附加选项后刷新选择菜单：

<ul>

您的更新jsfiddle。

新添加新选项到多下拉菜单显示

2 个答案: