Question

我的问题是关于java脚本，我想使用java脚本在select标签中放置或添加div或按钮或输入。

我使用jquery.sumoselect插件让你有多个复选框，但当我想在select tag中添加一些DIV时，会在列表外显示。

我希望选择元素中的div如下图所示：http://i.stack.imgur.com/Xd6FX.jpg

这是我的HTML代码

<div class="select-box-style right">
                    <div class="your-list-title">Your Lists</div>

                    <select multiple="multiple" class="md_what_get right SlectBox">
                        <option selected value="electronics">Electronics</option>
                        <option value="games">Video Games</option>
                        <option value="books">Books</option>
                        <option value="others">Others</option>
                        <option value="others"><input type="text" name="lname"></option>
                    </select>
                    <div class="add-list-box">
                        <input type="text" class="input-add-list"/>
                        <label class="label-spcbtn-blue spr" >Add</label>
                    </div>
                </div>

以及如何调用插件：

<script type="text/javascript">
                    $(document).ready(function () {
                        $('.SlectBox').SumoSelect();
                    });
                </script>

谢谢你的帮助！

.... 更新！

请参阅此链接http://wenzhixin.net.cn/p/multiple-select/docs/

在Filter1上，您可以在select元素中看到输入搜索，我该怎么做？

Answer 1

SumoSelect或MultipleSelect（不支持）都不支持您正在查看的功能。但是，首先，需要做一些澄清：

＆LT;选择＆GT; box是标准HTML标记，不接受除＆lt; optgroup＆gt;之外的其他标记。或＆lt;选项＆gt;。见这里：https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select

SumoSelect和MultipleSelect都是Javascript插件，可以将真正的选择“转换”为自定义构建的＆lt; div＆gt;标签，用javascript来处理逻辑。也就是说，您可以修改/扩展这些插件以创建所需的＆lt; div＆gt;或者你可以建立自己的“＆lt; select＆gt;进入＆lt; div＆gt;转换器”。

但是，为了简单起见，您可以创建一个＆lt; div＆gt;具有所有所需功能，使用常规普通旧复选框，并隐藏/显示整个＆lt; div＆gt;根据您的用户体验流程/需求。

如何使用javascript添加DIV以选择选项

1 个答案: