多选框互选

多选框:multiple OPTGROUP

第一个多选框
<SELECT id=select1 style="WIDTH: 170px; HEIGHT: 235px" 
            onchange="moveSelected(this.form.select1, this.form.select2);" 
            multiple name=select1><OPTGROUP label=合肥市> <OPTION 
                value=340100>合肥市</OPTION> <OPTION value=340101>市辖区</OPTION> 
                <OPTION value=340102>瑶海区</OPTION> 
</SELECT>
第二个多选框

<SELECT id=select2 style="WIDTH: 170px; HEIGHT: 235px" 
            onchange="moveSelected(this.form.select2, this.form.select1);" 
            multiple name=select2></SELECT>

// 脚本
<SCRIPT type=text/javascript>//<![CDATA[
function moveSelected(sourceSelect, targetSelect, isDelete){
	var cachOptionsArray = new Array();
	var index = 0;
	for (var i = sourceSelect.options.length - 1; i >= 0; i--){
		if (sourceSelect.options[i].selected){
			cachOptionsArray[index] = new Option(sourceSelect.options[i].text, sourceSelect.options[i].value);
			if(isDelete==undefined || isDelete==true){
				sourceSelect.options[i] = null;
			}
			index++;
		}
	}
	var exist = false;
	for (var i = cachOptionsArray.length - 1; i >= 0; i--){
		exist = false;
		for (var j = 0; j < targetSelect.options.length; j++){
			if (targetSelect.options[j].value.toString() == cachOptionsArray[i].value.toString()){
				exist = true; 
				break;
			}
		}
		if (!exist){
			targetSelect.options[targetSelect.options.length] = cachOptionsArray[i];
		}
	}
}
//]]></SCRIPT>

你可能感兴趣的:(JavaScript,html,脚本,J#)