Question

我无法找到解决此问题的方法。我想在semantic-ui中使用javascript添加新的选项，使用值，但是我无法弄清楚如何去做。 Exaple：

HTML：

<select multiple class="form-control ui fluid search dropdown" name="city" id="city">
    <option value="NY">New York</option>
    <option value="LA">Los Angeles</option>
</select>

使用Javascript：

$('#city').dropdown();

我只想说我想使用javascript在选择列表中添加新选项（例如<option value="DC">Washington</option>）。我怎么能这样做？

Answer 1

试试这个：

var s = document.getElementById("city");
var option = document.createElement("option");
option.text = "Washington";
option.value= "DC";
s.add(option);
//or add your option at the beginning
s.add(option, s[0];

Answer 2

我找到了答案，我把select块放在id为＃34; cityWrapper＆＃34;的div中，如下所示：

<div id="cityWrapper">
    <select multiple class="form-control ui fluid search dropdown" name="city" id="city">
        <option value="NY">New York</option>
        <option value="LA">Los Angeles</option>
    </select>
</div>

在javascript文件中，我插入了这样的选项：

$('#cityWrapper > > .menu').append('<div class="item" data-value="DC">Washington</div>');

那就是全部。

修改

您可以在javascript文件中使用$('#city').dropdown('add optionValue', 'Washington');，但该值与选项中的文本相同（在本例中为华盛顿）。

Answer 3

无法执行以上任何一项操作，相反，我只是销毁并重新实例化了下拉菜单：

$("#myDiv").dropdown("destroy");
$('#myDiv').dropdown({values: newValuesArray});
//optionally fire the select event to add either the new value(s) 
//or re-add the previously selected values
$("#myDiv").dropdown("set selected", "some value");

如何在semantic-ui多选中添加带有值的选项？

3 个答案: