使用ASP与JAVASCRIPT配合实现多个复选框数据关联显示
类别: ASP教程 
<HTML>
<HEAD>
<META NAME="AUTHOUR" Content="DANNY KANG">
<META NAME="CreateDate" Content="2004-10-28">
<META NAME="Keywords" Content="DANNY KANG,DannyKang,DK,[D.K],pizz">
<META http-equiv=content-type content="text/html; charset=gb2312">
<SCRIPT language=javascript>
//第一个复选框的内容
var DK_Array1 = new Array();
/*以下部分，可以使用ASP动态生成*/
DK_Array1[DK_Array1.length]=new Array(\'1\',\'分类1\'); //分类ID，分类名称
DK_Array1[DK_Array1.length]=new Array(\'2\',\'分类2\');
DK_Array1[DK_Array1.length]=new Array(\'3\',\'分类3\');
DK_Array1[DK_Array1.length]=new Array(\'4\',\'分类4\');
DK_Array1[DK_Array1.length]=new Array(\'5\',\'分类5\');
DK_Array1[DK_Array1.length]=new Array(\'6\',\'分类6\');
DK_Array1[DK_Array1.length]=new Array(\'7\',\'分类7\');
DK_Array1[DK_Array1.length]=new Array(\'8\',\'分类8\');
///////////////////////////////////////////////////////
//第三个复选框的内容
var DK_Array3 = new Array();
/*以下部分，可以使用ASP动态生成*/
DK_Array3[DK_Array3.length]=new Array(\'1\',\'1\',\'小类1.1\'); //分类ID，小类ID，小类名称
DK_Array3[DK_Array3.length]=new Array(\'1\',\'2\',\'小类1.2\');
DK_Array3[DK_Array3.length]=new Array(\'1\',\'3\',\'小类1.3\');
DK_Array3[DK_Array3.length]=new Array(\'2\',\'4\',\'小类2.4\');
DK_Array3[DK_Array3.length]=new Array(\'2\',\'5\',\'小类2.5\');
DK_Array3[DK_Array3.length]=new Array(\'2\',\'6\',\'小类2.6\');
DK_Array3[DK_Array3.length]=new Array(\'2\',\'7\',\'小类2.7\');
DK_Array3[DK_Array3.length]=new Array(\'3\',\'8\',\'小类3.8\');
DK_Array3[DK_Array3.length]=new Array(\'4\',\'9\',\'小类4.9\');
DK_Array3[DK_Array3.length]=new Array(\'4\',\'10\',\'小类4.10\');
DK_Array3[DK_Array3.length]=new Array(\'4\',\'11\',\'小类4.11\');
DK_Array3[DK_Array3.length]=new Array(\'4\',\'12\',\'小类4.12\');
DK_Array3[DK_Array3.length]=new Array(\'5\',\'13\',\'小类5.13\');
DK_Array3[DK_Array3.length]=new Array(\'5\',\'14\',\'小类5.14\');
DK_Array3[DK_Array3.length]=new Array(\'6\',\'15\',\'小类6.15\');
DK_Array3[DK_Array3.length]=new Array(\'6\',\'16\',\'小类6.16\');
DK_Array3[DK_Array3.length]=new Array(\'6\',\'17\',\'小类6.17\');
DK_Array3[DK_Array3.length]=new Array(\'6\',\'18\',\'小类6.18\');
DK_Array3[DK_Array3.length]=new Array(\'6\',\'19\',\'小类6.19\');
DK_Array3[DK_Array3.length]=new Array(\'7\',\'20\',\'小类7.20\');
DK_Array3[DK_Array3.length]=new Array(\'8\',\'21\',\'小类8.21\');
DK_Array3[DK_Array3.length]=new Array(\'8\',\'22\',\'小类8.22\');
///////////////////////////////////////////////////////
function DK_AddOnTo(obj,val,txt){ //增加一项
if(DK_CheckExists(obj,val,txt)) {
alert(\'选项已存在：[\'+obj.id+\']\'+\'n Value: \'+ val+\'n Text: \'+txt);
return;
}
var opt=new Option();
opt.value=val;
opt.text=txt;
obj.options.add(opt,0);
}
function DK_InitListObject(obj,array){//初始化列表
if(array.length){
for(var i=0;i<array.length;i++){
DK_AddOnTo(obj,array[i][0],array[i][1]);
}
}
else {
alert(\'无数据\');
}
}
function DK_AddTo(src,obj){//往指定列表添加选项
for(var i=0;i<src.length;i++){
if(src.options[i].selected){
DK_AddOnTo(obj,src.options[i].value,src.options[i].text);
}
}
}
function DK_SelectAll(obj){ //选中全部选项
for(var i=0;i<obj.length;i++){
obj.options[i].selected = true;
}
}
function DK_ClearAll(obj){//删除全部选项
if(obj.length-1>=0){
for(var i=obj.length-1;i>=0;i--){
obj.remove(i);
}
}
}
function DK_RemoveOne(obj){//删除选定项
for(var i=obj.length-1;i>=0;i--){
if(obj.options[i].selected){
obj.remove(i);
}
}
}
function DK_CheckExists(obj,val,txt){//检查项是否已存在
if(obj.length<0) return false;
for(var i=0;i<obj.length;i++){
if(obj.options[i].value==val && obj.options[i].text==txt) {
return true;
}
}
return false;
}
function DK_ListTo(src,obj,array){//显示子类
if(array.length){
var j=0;
for(var i=0;i<src.length;i++){
if(src.options[i].selected){
j+=DK_AddSpecList(src.options[i].value,array,obj);
}
}
alert(\'共发现\'+j+\'个小类。\');
}
else {
alert(\'无数据\');
}
}
function DK_AddSpecList(classid,array,obj){//搜索子类
var j=0;
for(var i=0;i<array.length;i++){
if(array[i][0]==classid){
DK_AddOnTo(obj,array[i][1],array[i][2]);
j++;
}
}
return j;
}
</SCRIPT>
<STYLE type=text/css></STYLE>
<TITLE></TITLE>
</HEAD>
<BODY>
<table>
<tr><td colspan=4><input type=button value=\'初始化复选框一\' onclick=\'DK_InitListObject(select1,DK_Array1)\'><br><br>
<tr><td>复选框一：<td><select multiple id=select1 size=8></select>
<td><input type=button value=\'添加\' onclick=\'DK_AddTo(select1,select2)\'> ==>
<td>复选框二：<br><== <input type=button value=\'删除\' onclick=\'DK_RemoveOne(select2)\'>
<input type=button value=\'全删\' onclick=\'DK_ClearAll(select2)\'>
<td><select multiple id=select2 size=8></select>
<td><input type=button value=\'列出相关\' onclick=\'DK_ListTo(select2,select3,DK_Array3)\'> ==>
<td>复选框三：<br><== <input type=button value=\'删除\' onclick=\'DK_RemoveOne(select3)\'>
<input type=button value=\'全删\' onclick=\'DK_ClearAll(select3)\'>
<td><select multiple id=select3 size=8></select><br>
</table>
</BODY>
</HTML>
<HEAD>
<META NAME="AUTHOUR" Content="DANNY KANG">
<META NAME="CreateDate" Content="2004-10-28">
<META NAME="Keywords" Content="DANNY KANG,DannyKang,DK,[D.K],pizz">
<META http-equiv=content-type content="text/html; charset=gb2312">
<SCRIPT language=javascript>
//第一个复选框的内容
var DK_Array1 = new Array();
/*以下部分，可以使用ASP动态生成*/
DK_Array1[DK_Array1.length]=new Array(\'1\',\'分类1\'); //分类ID，分类名称
DK_Array1[DK_Array1.length]=new Array(\'2\',\'分类2\');
DK_Array1[DK_Array1.length]=new Array(\'3\',\'分类3\');
DK_Array1[DK_Array1.length]=new Array(\'4\',\'分类4\');
DK_Array1[DK_Array1.length]=new Array(\'5\',\'分类5\');
DK_Array1[DK_Array1.length]=new Array(\'6\',\'分类6\');
DK_Array1[DK_Array1.length]=new Array(\'7\',\'分类7\');
DK_Array1[DK_Array1.length]=new Array(\'8\',\'分类8\');
///////////////////////////////////////////////////////
//第三个复选框的内容
var DK_Array3 = new Array();
/*以下部分，可以使用ASP动态生成*/
DK_Array3[DK_Array3.length]=new Array(\'1\',\'1\',\'小类1.1\'); //分类ID，小类ID，小类名称
DK_Array3[DK_Array3.length]=new Array(\'1\',\'2\',\'小类1.2\');
DK_Array3[DK_Array3.length]=new Array(\'1\',\'3\',\'小类1.3\');
DK_Array3[DK_Array3.length]=new Array(\'2\',\'4\',\'小类2.4\');
DK_Array3[DK_Array3.length]=new Array(\'2\',\'5\',\'小类2.5\');
DK_Array3[DK_Array3.length]=new Array(\'2\',\'6\',\'小类2.6\');
DK_Array3[DK_Array3.length]=new Array(\'2\',\'7\',\'小类2.7\');
DK_Array3[DK_Array3.length]=new Array(\'3\',\'8\',\'小类3.8\');
DK_Array3[DK_Array3.length]=new Array(\'4\',\'9\',\'小类4.9\');
DK_Array3[DK_Array3.length]=new Array(\'4\',\'10\',\'小类4.10\');
DK_Array3[DK_Array3.length]=new Array(\'4\',\'11\',\'小类4.11\');
DK_Array3[DK_Array3.length]=new Array(\'4\',\'12\',\'小类4.12\');
DK_Array3[DK_Array3.length]=new Array(\'5\',\'13\',\'小类5.13\');
DK_Array3[DK_Array3.length]=new Array(\'5\',\'14\',\'小类5.14\');
DK_Array3[DK_Array3.length]=new Array(\'6\',\'15\',\'小类6.15\');
DK_Array3[DK_Array3.length]=new Array(\'6\',\'16\',\'小类6.16\');
DK_Array3[DK_Array3.length]=new Array(\'6\',\'17\',\'小类6.17\');
DK_Array3[DK_Array3.length]=new Array(\'6\',\'18\',\'小类6.18\');
DK_Array3[DK_Array3.length]=new Array(\'6\',\'19\',\'小类6.19\');
DK_Array3[DK_Array3.length]=new Array(\'7\',\'20\',\'小类7.20\');
DK_Array3[DK_Array3.length]=new Array(\'8\',\'21\',\'小类8.21\');
DK_Array3[DK_Array3.length]=new Array(\'8\',\'22\',\'小类8.22\');
///////////////////////////////////////////////////////
function DK_AddOnTo(obj,val,txt){ //增加一项
if(DK_CheckExists(obj,val,txt)) {
alert(\'选项已存在：[\'+obj.id+\']\'+\'n Value: \'+ val+\'n Text: \'+txt);
return;
}
var opt=new Option();
opt.value=val;
opt.text=txt;
obj.options.add(opt,0);
}
function DK_InitListObject(obj,array){//初始化列表
if(array.length){
for(var i=0;i<array.length;i++){
DK_AddOnTo(obj,array[i][0],array[i][1]);
}
}
else {
alert(\'无数据\');
}
}
function DK_AddTo(src,obj){//往指定列表添加选项
for(var i=0;i<src.length;i++){
if(src.options[i].selected){
DK_AddOnTo(obj,src.options[i].value,src.options[i].text);
}
}
}
function DK_SelectAll(obj){ //选中全部选项
for(var i=0;i<obj.length;i++){
obj.options[i].selected = true;
}
}
function DK_ClearAll(obj){//删除全部选项
if(obj.length-1>=0){
for(var i=obj.length-1;i>=0;i--){
obj.remove(i);
}
}
}
function DK_RemoveOne(obj){//删除选定项
for(var i=obj.length-1;i>=0;i--){
if(obj.options[i].selected){
obj.remove(i);
}
}
}
function DK_CheckExists(obj,val,txt){//检查项是否已存在
if(obj.length<0) return false;
for(var i=0;i<obj.length;i++){
if(obj.options[i].value==val && obj.options[i].text==txt) {
return true;
}
}
return false;
}
function DK_ListTo(src,obj,array){//显示子类
if(array.length){
var j=0;
for(var i=0;i<src.length;i++){
if(src.options[i].selected){
j+=DK_AddSpecList(src.options[i].value,array,obj);
}
}
alert(\'共发现\'+j+\'个小类。\');
}
else {
alert(\'无数据\');
}
}
function DK_AddSpecList(classid,array,obj){//搜索子类
var j=0;
for(var i=0;i<array.length;i++){
if(array[i][0]==classid){
DK_AddOnTo(obj,array[i][1],array[i][2]);
j++;
}
}
return j;
}
</SCRIPT>
<STYLE type=text/css></STYLE>
<TITLE></TITLE>
</HEAD>
<BODY>
<table>
<tr><td colspan=4><input type=button value=\'初始化复选框一\' onclick=\'DK_InitListObject(select1,DK_Array1)\'><br><br>
<tr><td>复选框一：<td><select multiple id=select1 size=8></select>
<td><input type=button value=\'添加\' onclick=\'DK_AddTo(select1,select2)\'> ==>
<td>复选框二：<br><== <input type=button value=\'删除\' onclick=\'DK_RemoveOne(select2)\'>
<input type=button value=\'全删\' onclick=\'DK_ClearAll(select2)\'>
<td><select multiple id=select2 size=8></select>
<td><input type=button value=\'列出相关\' onclick=\'DK_ListTo(select2,select3,DK_Array3)\'> ==>
<td>复选框三：<br><== <input type=button value=\'删除\' onclick=\'DK_RemoveOne(select3)\'>
<input type=button value=\'全删\' onclick=\'DK_ClearAll(select3)\'>
<td><select multiple id=select3 size=8></select><br>
</table>
</BODY>
</HTML>
- 上一篇: ASP登陆验证页应做的安全问题
- 下一篇: WINDOWS 2003下不注册组件用ASP发邮件
