Question

我有两个jquery select2实例，它们具有相同的选项和相同的类我希望每次在一个select2实例中选择一个选项时，它在两个实例中都不可用

<select class="select2-element" multiple="multiple"> //instance 1
    <option value="AL">Alabama</option>
    ...
    <option value="WY">Wyoming</option>
</select>

<select class="select2-element" multiple="multiple"> //instance 2
    <option value="AL">Alabama</option>
    ...
    <option value="WY">Wyoming</option>
</select>

修改为简单起见，我提到我有两个选择元素，但实际上我有动态生成的x元素

Answer 1

如何为第二个class Example1Mapper extends DataMapper { function __construct( Provider1 $provider1 ) { ... } } class Example2Mapper extends DataMapper { function __construct( Provider1 $provider1, Provider2 $provider2 ) { ... } }代码添加<select>

等ID

并在jQuery中添加一个监听器，如：

<select id="changeSelect"...

我可能还建议删除第一个$('select2-element').on('change', function() { var selectValue = $(this).val(); $('#changeSelect').val( selectValue); });标记上的select2-element类，以防止第二个类动态选择

Answer 2

好吧，为了避免所有实例都获得像@blubberbo提到的相同的选定项目，我给每个元素一个id，我改变了检索所选选项的方法。我使用select2.js生成的类作为选择器来从select2元素中获取所选的选项。

    $('#Save').click(function () {
        $('.select2-element').each(function () {
            var instance = $(this).attr('id');
            $('#s2id_' + instance + ' li.select2-search-choice div').each(function () {
                alert($(this).attr('id'));
            });
        });
    });

li.select2-search-choice下的div元素没有id属性，所以我把它添加到select2.js中，如下所示：

choice.find("div").replaceWith("<div id="+id+" >"+formatted+"</div>");

更新jquery select2多个实例的可用选项

2 个答案: