Question

我有boostrap duallistbox，我想添加向上或向下移动所选值的选项。

有人可以帮我解决这个问题吗。

由于

Answer 1

请参阅本文“设置”部分中引用的 moveOnSelect 选项：

http://www.jqueryscript.net/demo/Responsive-jQuery-Dual-Select-Boxes-For-Bootstrap-Bootstrap-Dual-Listbox/

＆＃34; true：选项会自动移动选项。此设置强制在触摸设备上。＆＃34;

＆＃34; false：可以使用按钮移动所选选项。＆＃34;

Answer 2

您可以上下添加两个按钮。添加具有两个集合的点击处理程序：一个包含所有选项，另一个包含选定选项。

function MoveDown(dualListbox) {
        var selectedItems = dualListbox.elements.box2.find(':selected');

        for (var i = selectedItems.length - 1; i > -1; i--)
        {
            var allItems = dualListbox.elements.box2.find('option');
            var selectedItem = $(selectedItems[i]);
            var selectedIndex = selectedItem.index();
            selectedItem.insertAfter(allItems[selectedIndex + 1]);
        }
    }

注意当你要编写MoveUp处理程序时，你应该从所有选项集合的开头开始并在前一个选项之前插入

Answer 3

在这里上下移动

    function MoveDown(dualListbox) {
       var selectedItems = dualListbox.elements.box2.find(':selected');

       for (var i = selectedItems.length - 1; i > -1; i--) {
           var allItems = dualListbox.elements.box2.find('option');
           var selectedItem = $(selectedItems[i]);
           var selectedIndex = selectedItem.index();
           selectedItem.insertAfter(allItems[selectedIndex + 1]);
       }
    }

    function MoveUp(dualListbox) {
       var selectedItems = dualListbox.elements.box2.find(':selected');

       for (var i = 0;i<=selectedItems.length;i++) {
           var allItems = dualListbox.elements.box2.find('option');
           var selectedItem = $(selectedItems[i]);
           var selectedIndex = selectedItem.index();
           selectedItem.insertBefore(allItems[selectedIndex - 1]);
       }
    }

bootstrap duallistbox上移下移

3 个答案: