您的位置：首页 > 其它

按钮触发table添加一行删除一行

2010-08-16 08:40 405 查看 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<title>addHtml.html</title>

		<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
		<meta http-equiv="description" content="this is my page">
		<meta http-equiv="content-type" content="text/html; charset=UTF-8">

		<!--<link rel="stylesheet" type="text/css" href="./styles.css" mce_href="styles.css">-->
		<mce:script type="text/javascript"><!--
var nFieldCount =0;
function addSearchCondition(){
  var tabCondition =document.getElementById("tabCondition");
  var tabBody = tabCondition.firstChild;
  var newTr = tabBody.insertRow(); 
  //添加列		
  var newTd = new Array(); 
  nRowCount = tabBody.children.length - 1;
  for(i= 0; i < 7; i++){
    newTd[i] = newTr.insertCell(); 
    if(i==6){
      newTd[i].innerHTML = "<a href="#" mce_href="#" onclick=/"delTabConditionRow('"+ nRowCount +"')/">删除</a>"; 
      newTd[i].width="5%";
    }
  } 
  nFieldCount++; 
  addCaptionField(newTd[0]);
  addTextField(newTd[1]);
  addconectField(newTd[2]);
  
  nFieldCount++; 
  addCaptionField(newTd[3]);
  addTextField(newTd[4]);  
  addconectField(newTd[5]); 
  
}

function addTextField(newTd){
  newTd.innerHTML = "<input	id='propValues"+ nFieldCount +"' name='propValues' type='text'  class='st_text' />";
  newTd.width="30%";
  newTd.height="28";
  newTd.className ="FieldValue2";  
}

function addCaptionField(newTd){
   newTd.innerHTML = "<select name ='"+ "propIds"
           +"' id='"+ "propId"  + nFieldCount +"' >"
		  +"</select>"; 
  newTd.height="28";
  newTd.width="10%";
  newTd.align='right'; 
  newTd.className ="FieldTitle";   
//  var selectId = $("propId"+ nFieldCount);
  //addSelectItem(selectId);
}

 

function addconectField(newTd ){
  var strInnerHTML = "<select name =conditions" +"  id=condition"
         + nFieldCount +">"
		 +" <option value=/"and/" selected >并且</option>"
		 +" <option value=/"or/">或者</option></select>";
  newTd.innerHTML = strInnerHTML;		
  newTd.height="28";
  newTd.width="10%";
  newTd.className ="FieldValue2"; 
}

function delTabConditionRow(deletrow){
  var tabCondition =document.getElementById("tabCondition");
  var tabBody = tabCondition.firstChild;
  tabBody.deleteRow(deletrow);
  for(var i=1;i<tabBody.children.length;i++){  
		  tabBody.rows[i].cells[6].innerHTML= ' <a  href="javascript:void(0)" mce_href="javascript:void(0)" onclick="delTabConditionRow('+i+')">删除</A>';
  }
		  
}
   
// --></mce:script>
	</head>

	<body>
		<input type="button" value="新增" onclick="addSearchCondition()" />
		<table id=tabCondition width='100%' align='center' cellpadding='0'
			cellspacing='0'>
			<tr height="28">
			<td width="10%" class='FieldTitle' align="right">
				字段名称
			</td>
			<td width="30%" class='FieldTitle' align="center">
				查询值
			</td>
			<td width="10%" class='FieldTitle'>
				连接条件
			</td>
			<td width="10%" class='FieldTitle' align="right">
				字段名称
			</td>
			<td width="25%" class='FieldTitle' align="center">
				查询值
			</td>
			<td width="10%" class='FieldTitle'>
				连接条件
			</td>
			<td width="5%" class='FieldTitle'>
				操作
			</td>
		</tr>
		</table>
	</body>
</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航