在HTML网页中用JavaScript实现两个选择框中的内容实现互选

来源：互联网发布：java微信支付视频教程编辑：程序博客网时间：2024/06/07 18:28

最近在学习javascript,想将一些学习中的东西和大家分享。

在html网页中实现两个选择框中的内容实现互选的源代码：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<SCRIPT LANGUAGE="JavaScript">

function moveRight(){
  var addsz=new Array();
  var obj =document.form1.left;
  for(var i=0;i<obj.options.length;i++){
   if(obj.options[i].selected){
    var txt =obj.options[i].text;
    var val =obj.options[i].value;

    var op = new Option(txt,val);
    document.form1.right.options.add(op);
    //document.form1.left.options.remove(obj.options[i]);
   }else{
    addsz.push(obj.options[i]);
     }
   }
  document.form1.left.options.innerHTML="";
  for(var i=0;i<addsz.length;i++){
     document.form1.left.options.add(new Option(addsz[i].text));
   }

}
function moveLeft(){
  var addlf =new Array();
  var obj =document.form1.right;
  for(var i=0;i<obj.options.length;i++){
   if(obj.options[i].selected){
    var txt =obj.options[i].text;
    var val =obj.options[i].value;
    //alert(txt);
    var op = new Option(txt,val);
    document.form1.left.options.add(op);
   }else{
    addlf.push(obj.options[i]);
     }
   }
  document.form1.right.options.innerHTML="";
  for(var i=0;i<addlf.length;i++){
     document.form1.right.options.add(new Option(addlf[i].text));
   }

}
</SCRIPT>
</HEAD>