html下拉菜单后面内容移动,jQuery实现下拉框左右移动（全部移动，已选移动）...

用到的方法为：appendTo()

格式：$(content).appendTo(selector)

appendTo() 方法在被选元素的结尾(仍然在内部)插入指定内容。

click() 方法触发 click 事件，或规定当发生 click 事件时运行的函数。

看一下具体实现的代码：

$(function () {

$("#add").click(function () {

//1,方式一

// var $option = $("#select1 option:selected"); //获取选中的选项

// var $remove = $option.remove(); //删除下拉列表中选中的选项

// $remove.appendTo("#select2"); //追加给对方

//2，方式二

var $option = $("#select1 option:selected"); //获取选中的选项

$option.appendTo("#select2"); //追加给对方

});

$("#add_all").click(function () {

var $option = $("#select1 option");

$option.appendTo("#select2");

});

$("#remove").click(function () {

var $option = $("#select2 option:selected");

$option.appendTo("#select1");

});

$("#remove_all").click(function () {

var $option = $("#select2 option");

$option.appendTo("#select1");

});

});

下拉框应用

News Sport Education Technology Art

>| >> << |<

运行效果：