JavaScript动态添加和删除控件

< input type = " button "  onClick = " add(); "  value = " 添加控件 " >
< div id = " a " >

</ div >
< script >
var  num = 0 ;
function  add() ... {
alert(window.document.getElementById( " a " ).innerHTML);
window.document.getElementById( " a " ).innerHTML = window.document.getElementById( " a " ).innerHTML  +   " <br/><input type='text' id='up " + num + " '><a href='#' onClick=' style="COLOR: #000000">" + num + " );'>删除此控件 " + num + " </a> " ;  
num = num + 1 ;
}
function  del(n) ... {
var  str = window.document.getElementById( " a " ).innerHTML;
var  regEx = new  RegExp( " <BR><[^<>]*(up " + n + " ){1}[^<>]*><[^<>]*>[^<>]*</A> " );
str = str.replace(regEx, "" );
alert(str);
window.document.getElementById( " a " ).innerHTML = str;
}
</ script >

/********************************************************/

var currFocus;
var ExistAttaInfo = new Array();
var oldDelAttas = new Array();
var attaIdx = 0;
var IsIE;
function fInitMSIE()...{
if (navigator.userAgent.indexOf("MSIE") != -1)...{
IsIE = true;
}

else ... {
IsIE  =   false ;
}
}
fInitMSIE();

 

function  fTrim(str) ... {
str  =  str.replace( / ( ^ s * ) / , "" );
str  =  str.replace( / (s * $) / , "" );
return  str;
}

// 本js文件用于compose.htm同时发送多个附件的js函数，支持 IE 和 NNx 系列。
// 所有的函数都适用于 IE 和 NNx 系列，直接调用就可以
// 函数里面会根据语句判断浏览器类型，然后依据不同的bowser属性增加元素
// 主要功能是动态创建 各种表单元素 和 删除表单元素
// written by xpr

//     function list
//     -------------------------------------------------------------------------------------------------------------------
//     IsIEBrowser()  返回值: true(IE) false(NNx)
//     exist(fileId)  判断fileId是否已经存在
//     addInputFile(spanId,fileId)  在名为spanId 的元素里面增加序号为index的input file
//     addbr(spanId,brId)  在名为spanId 的元素里面增加id为brId的换行符
//     adddel(spanId,index) 在名为spanId 的元素里面增加序号为index的"删除"按钮，他可以删除相应的input file 和 br
//     addhidden(spanId,hiddenId,value)  在名为spanId 的元素里面增加id为hiddenId，值为value的input type=hidden
//     -------------------------------------------------------------------------------------------------------------------

var  IsIE;
var  attaIdx  =   0 ;

// search,全局变量
// -----------------------------------------------------------------------------------------------------------
function  IsIEBrowser()  ... {
if  (navigator.userAgent.indexOf( " MSIE " )  !=   - 1 )  ... {
return   true ;
}   else   ... {
return   false ;
}
}

//  增加附件函数 ()，增加到 idfilespan,基数为 attaIdx 。

function  add()  ... {

addfile( " idfilespan " ,attaIdx);
attaIdx ++ ;
return   false ;
}

// ----------------------------------------fileexist()----------------------------------------------------------
// edited by alun
function  exist(fileId)  ... {
       var  file  =  document.getElementById(fileId);
   var  result  =   false ;
   if  ( file  != null  )  ... {
if  ( file.value  !=   null   &&  file.value  !=   "" )  ... {
result  =  existFile( file);

} // if
  }
   if ( result)
   ... {
alert( " 这个附件您已经添加过了,新添加的附件将已被删除 " );
// document.sendmail."+fileId+".value=""";
var  attach_num  =  fileId.substring( 10 , 12 );

delfile( " idfilespan " ,attach_num);
 
// --attaIdx;
// document.getElementById( "idAttachOper"+ attaIdx).click();
  }
} // end of function
// added by alun
function  getfilename( attaName )  ... {
var  s  =  attaName.lastIndexOf(  ' \ '  );
return  attaName.substr(s + 1 , attaName.length  -  s  - 1 );
}
// added by alun
function  existFile( file)
... {
var  form  =  document.sendmail;
for  (  var  i =   0  ; i  <  form.elements.length ; i  ++  )  ... {    
if  ( form.elements[i].type  ==   " file "   &&  form.elements[i].name  !=  file.name )  ... {
if  ( file.value  ==  form.elements[i].value )  ... {
// alert(form.elements[i].value=null);
return   true ;
}
}
} // for
for  ( var  i = 0 ; i < ExistAttaInfo.length; i ++ )  ... {
var  theName  =  ExistAttaInfo[i];
if  ( theName  !=   null   &&  theName  !=   ""   &&  theName  ==  getfilename(file.name) )  ... {
return   true ;
}
}
return   false ;
}

转载于:https://www.cnblogs.com/meiproject/archive/2007/04/26/728226.html