jquery对table里的元素进行编辑,并且获取table表格里td元素值

<table id="mytable" width="80%">
          <tbody><tr id="showItems">
	         <td>商品名称</td> 
		     <td>规格型号</td> 
		     <td>单位</td> 
		     <td>税率</td> 
		     <td>数量</td> 
		     <td>单价</td>
		     <td>操作</td>  
          </tr><tr><td>国家军用标准编辑器(预售)</td><td></td><td>套</td><td>0.1</td><td>1</td><td>2000</td><td><input type="button" onclick="editOrderItem(this)" value="编辑"></td></tr>
        </tbody></table>
/**
 * 通过点击事件将当前td变成输入框,并且可以进行编辑
 * @param obj
 */
function editOrderItem(obj){
	var btn=$(obj).val();
	if(btn=='编辑'){
		$(obj).prop('value',"保存");
		var len=$(obj).parent().siblings().length;
		for(var i=0;i<len;i++){
			$(obj).parent().siblings().eq(i).html("<input type='text' value='"+$(obj).parent().siblings().eq(i).text()+"'>");
		}
	}else{
		$(obj).prop('value',"编辑");
		var tdInput=$(obj).parent().siblings().find("input");
		for(var i=0;i<tdInput.length;i++){
			$(obj).parent().siblings().eq(i).html($(tdInput[i]).val());
		}
	}
}
/**
 * 获取table表格里每行td元素里的值
 */
function getTable(){
	 var orderItemArray=new Array();
	 var orderItem={};
	 $('#mytable tr').each(function(i){  
	    if(i!=0){
	    $(this).children('td').each(function(j){
	      switch (j) {
			case 1:
				orderItem.proName=$(this).text();
				break;
			case 2:
				orderItem.proModel=$(this).text();
				break;
			case 3:
				orderItem.unit=$(this).text();
				break;
			case 4:
				orderItem.taxRate=$(this).text();
				break;
			case 5:
				orderItem.goodsNumber=$(this).text();
				break;
			case 6:
				orderItem.marketPrice=$(this).text();
				break;
			}
	     });
	        orderItemArray.push(orderItem);
	     }
	    });
	 //可以将数组对象转换成json字符串
	 //JSON.stringify(orderItemArray);
	 return orderItemArray;
}

猜你喜欢

转载自blog.csdn.net/semial/article/details/82496259