jQuery实现下拉框左右选择的简单实例

前端技术 2023/09/07 JavaScript

就是实现这个效果的,选中添加到右边,全部添加到右边,选中删除到左边,全部删除到左边。

html部分:

复制代码 代码如下:

<body>
    <div class=\"centent\">
        <select multiple=\"multiple\" id=\"select1\" style=\"width:100px;height:160px;\">
            <option value=\"1\">选项1</option>
            <option value=\"2\">选项2</option>
            <option value=\"3\">选项3</option>
            <option value=\"4\">选项4</option>
            <option value=\"5\">选项5</option>
            <option value=\"6\">选项6</option>
            <option value=\"7\">选项7</option>
        </select>
        <div>
            <span id=\"add\" >选中添加到右边>></span>
            <span id=\"add_all\" >全部添加到右边>></span>
        </div>
    </div>

    <div class=\"centent\">
        <select multiple=\"multiple\" id=\"select2\" style=\"width: 100px;height:160px;\">
            <option value=\"8\">选项8</option>
        </select>
        <div>
            <span id=\"remove\"><<选中删除到左边</span>
            <span id=\"remove_all\"><<全部删除到左边</span>
        </div>
    </div>
</body>

本文地址:https://www.stayed.cn/item/19049

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见,何事秋风悲画扇。