权限选择功能从一个select到另一个select

javascript代码：

<textarea cols="50" rows="15" name="code" class="javascript"> function movesome(selectSrc, selectTar) {//selectSrc为源对象，selectTar为目标对象 for (var i = selectSrc.childNodes.length - 1; i &gt;= 0; i--) { var option = selectSrc.childNodes[i]; if (option.selected==true) { selectSrc.removeChild(option); selectTar.appendChild(option); option.selected = false; } } } function moveall(selectSrc, selectTar) {//selectSrc为源对象，selectTar为目标对象 for (var i = selectSrc.childNodes.length - 1; i &gt;= 0; i--) { var option = selectSrc.childNodes[i]; selectSrc.removeChild(option); selectTar.appendChild(option); } } </textarea>

网页内容：

<textarea cols="50" rows="15" name="code" class="xhtml">&lt;select size="4" style="width:50px;" multiple="multiple" id="select1"&gt; &lt;option&gt;添加&lt;/option&gt; &lt;option&gt;删除&lt;/option&gt; &lt;option&gt;更改&lt;/option&gt; &lt;option&gt;浏览&lt;/option&gt; &lt;/select&gt; &lt;input type="button" value="&gt;" onclick="movesome(document.getElementById('select1'),document.getElementById('select2'))" /&gt;&lt;input type="button" value="&lt;" onclick="movesome(document.getElementById('select2'),document.getElementById('select1'))" /&gt;&lt;input type="button" value="&gt;&gt;" onclick="moveall(document.getElementById('select1'),document.getElementById('select2'))" /&gt;&lt;input type="button" value="&lt;&lt;" onclick="moveall(document.getElementById('select2'),document.getElementById('select1'))" /&gt; &lt;select size="4" style="width:50px;" multiple="multiple" id="select2"&gt; &lt;/select&gt; </textarea>

 

Jquery版

<textarea cols="50" rows="15" name="code" class="javascript"> $("#movetoright").click(function () { var items = $("#select1 option:selected").remove(); $("#select2").append(items); $("#select2 option").attr("selected", false); //清除option移动到右侧的自动选中的状态 }); $("#movetoleft").click(function () { var items = $("#select2 option:selected").remove(); $("#select1").append(items); $("#select1 option").attr("selected", false); //清除option移动到右侧的自动选中的状态 }); $("#movealltoright").click(function () { var items = $("#select1 option").remove(); $("#select2").append(items); $("#select2 option").attr("selected", false); //清除option移动到右侧的自动选中的状态 }); $("#movealltoleft").click(function () { var items = $("#select2 option").remove(); $("#select1").append(items); $("#select1 option").attr("selected", false); //清除option移动到右侧的自动选中的状态 }); </textarea>

 

网页内容：

<textarea cols="50" rows="15" name="code" class="xhtml">&lt;select size="4" style="width:50px;" multiple="multiple" id="select1"&gt; &lt;option&gt;添加&lt;/option&gt; &lt;option&gt;删除&lt;/option&gt; &lt;option&gt;更改&lt;/option&gt; &lt;option&gt;浏览&lt;/option&gt; &lt;/select&gt; &lt;input type="button" value="&gt;" id="movetoright" /&gt;&lt;input type="button" value="&lt;" id="movetoleft" /&gt;&lt;input type="button" value="&gt;&gt;" id="movealltoright" /&gt;&lt;input type="button" value="&lt;&lt;" id="movealltoleft" /&gt; &lt;select size="4" style="width:50px;" multiple="multiple" id="select2"&gt; &lt;/select&gt; </textarea>