`
FengShen_Xia
  • 浏览: 273005 次
  • 性别: Icon_minigender_1
  • 来自: 东方水城
社区版块
存档分类
最新评论

Table操作(自定义)

    博客分类:
  • Web
阅读更多
<table id="ccc" class="table_c" width="683" onClick="setPos(this)" style="border-collapse: collapse">
	<tr align="center" bgcolor="#5DC0F3">
		<td>
		</td>
	</tr>

	<tr>
		<td>
			<div contentEditable> </div> <!-- contentEditable 可以修改td中内容 -->
		</td>
	</tr>
</table>

 

	//新增行
	function insertRow(obj){
		if(currRow >= 0 && currRow<obj.rows.length){
			var maxCell=obj.rows[0].cells.length;
			obj.insertRow(currRow+1);
			for(var i=0;i<maxCell;i++){
				obj.rows[currRow+1].insertCell(i);
				obj.rows[currRow+1].cells[i].innerHTML="<div contentEditable>"+q[i]+"</div>";
			}
	    	clear();
	    	chnBgcolor(obj,currRow,"#5DC0F3");
	  	}
	  	qxs++;
	}
	
	//删除行
	function deleteRow(obj){
		var rows=obj.rows.length;
		if(currRow>=1&&currRow<rows){
		   obj.deleteRow(currRow);
		}
		clear();
		qxs--;
	}
	
	//改变选中行的颜色
	function chnBgcolor(obj,index,color){
	    for(var i=0;i<obj.rows.length;i++){
			if(i==index){
				obj.rows[i].bgColor=color;
				obj.rows[0].bgColor="#5DC0F3";
		  	}else{
				obj.rows[i].bgColor="#F6FCFF";
		   	}
		}
	}
	
	//选择行
	function setPos(obj){
		var o = event.srcElement;
		if(o.tagName == "DIV"){
			currRow = o.parentElement.parentElement.rowIndex;
			currCell=o.parentElement.cellIndex;
			chnBgcolor(obj,currRow,"#C8EAFF");
		}else if(o.tagName == "TD"){
			currRow=o.parentElement.rowIndex;
			currCell=o.cellIndex;
		}else{
			currRow=obj.rows.length-1;
	    	currCeil=obj.rows[0].cells.length-1;
		}
	}

	//清空
	function clear(){
		currRow=0;
		currCell=0;
	}

 

		//利用jquery获取table中的td内容
		var qx = "";
		$("#ccc td div").each(function(){
			qx = qx +$(this).html()+"|";
		});

 

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics