两个select控件之间如何传递数据？

[tuweiyi]

我的要求是这样的
网页中左边是一个多行的select控件，右边也是一个多行的select控件
中间是一个add按钮和delete按钮
当点击一下add时，右边控件中的条目就显示在左边的控件中
当点击一下delete时，左边控件中的条目就显示在右边的控件中
请教如何实现？
或者哪个网站上有类似的例子？
谢谢

[meizz]

<table border=0 cellpadding=0 cellspacing=0><form name=meizz>
<tr><td>
<select id=list1 size=8 ondblclick="moveOption(this, this.form.list2)">
<option value=A>aaaaaaaaaa
<option value=B>bbbbbbbbbb
<option value=C>cccccccccc
<option value=D>dddddddddd
<option value=E>eeeeeeeeee
<option value=F>ffffffffff
<option value=G>gggggggggg
<option value=H>hhhhhhhhhh
</select></td>
<td width=40 align=center>
<input name=add type=button value=">>>" onclick="moveOption(this.form.list1, this.form.list2)"><br><br>
<input name=sub type=button value="<<<" onclick="moveOption(this.form.list2, this.form.list1)">
</td><td>
<select id=list2 size=8 ondblclick="moveOption(this, this.form.list1)">
</select>
</td></tr></form>
</table>

<script language="JavaScript"><!--
function moveOption(e1, e2){
try{
var e = e1.options[e1.selectedIndex];
e2.options.add(new Option(e.text, e.value));
e1.options.remove(e1.selectedIndex);
} catch(e){}
}
//--></script>