jquery遍历table tr td获取放进数组转为对象传入后台

最新推荐文章于 2022-11-04 22:44:17 发布

恋念思尔悄悄然

最新推荐文章于 2022-11-04 22:44:17 发布

阅读量7.1k

点赞数 2

分类专栏：我的前端啦

本文链接：https://blog.csdn.net/sdiudui/article/details/79972875

版权

我的前端啦专栏收录该内容

15 篇文章 0 订阅

订阅专栏

小伙伴们一定遇到需要对table每行tr或者每列td进行循环遍历，把值取出来再放进一个数组里。然后转为一个对象传给后台吧，话不多说直接上代码

//确定
	$("#sure").click(function(){
		//定义一个数组
		var arrayColumn = new Array();
    	var trList = $("#getRows").children("tr");
    	for (var i=0;i<trList.length;i++){

    		var ColumnList = new Object();   //定义一个对象



//  		var tdArr = trList.eq(i).find("td");
// 
//  		var banner_android_pro = tdArr.eq(1).find("p img").attr("src");    //前景图
//  		var banner_android_back = tdArr.eq(3).find("p img").attr("src");   //背景图
//  		var banner_android_jump_type = tdArr.eq(5).find("select option:selected").attr("value");   //跳转类型
//  		
//  		if(banner_android_jump_type == 2){       //配置跳转
//  			var banner_android_configuration_jump = tdArr.eq(6).find("select option:selected").attr("value");
//  		}
//  		if(banner_android_jump_type == 3){
//  			var banner_android_configuration_jump = tdArr.eq(6).find("input[type='text']").attr("value");
//  		}
//  		
//  		alert(banner_android_configuration_jump);



上面这一段注释是遍历每一列td的因为项目需求最后要一行，所以我注释了，下面是遍历tr的每一行

			//alert(i);
			var trArr = trList.eq(i);
			//alert(trArr);
			var banner_android_pro = trArr.children("td").eq(1).find("p img").attr("src");    //前景图
			ColumnList.foregroundUrl = banner_android_pro;
			var banner_android_back = trArr.children("td").eq(3).find("p img").attr("src");   //背景图
			ColumnList.backgroundUrl = banner_android_back;
			var banner_android_jump_type = trArr.children("td").eq(5).find("select option:selected").attr("value");   //跳转类型
			ColumnList.srcType = banner_android_jump_type;
			if(banner_android_jump_type == 2){      //配置跳转
				var banner_android_configuration_jump = trArr.children("td").eq(6).find("select option:selected").attr("value");
				ColumnList.refCode = banner_android_configuration_jump;
			}
			if(banner_android_jump_type == 3){
				var banner_android_configuration_jump = trArr.children("td").eq(6).find("input[type='text']").attr("value");
				ColumnList.refCode = banner_android_configuration_jump;
			}
			ColumnList.homeType = 1;  //首页banner类型
			ColumnList.deviceType = "android";  //
			//将ColumnList对象放进arrayColumn数组中
			arrayColumn.push(ColumnList);
			
    	}
    	console.log(arrayColumn);
    	//调用后台接口将参数传入
    	$.ajax({
    		type:"post",
    		url:config.url+"/home/updateBanners",
    		async:true,
    		dataType:"json",
    		data:{
    			"token":window.sessionStorage.tokenbody,
    			"banners":JSON.stringify(arrayColumn)
    		},
    		success:function(data){
    			if(data.errcode == 0){
    				layer.msg("添加成功",{
						icon:1,
						time: 2000,
						end:function(){
							window.location.href="#/homemanagement";
						}
					});
    			}
    			if(data.errcode != 0 && data.errcode != 103){
					layer.msg(data.errmsg);
				}
    			if(data.errcode == 103){
					layer.msg(data.errmsg+",将于2秒后自动跳转到登录页");
					setTimeout('window.location.href="../../../LxarMirage/login.html"',2000);
				}
    		},
    		error:function(){
    			layer.msg("系统繁忙，请联系管理员");
    		}
    	});
   });

顺便还给小伙伴们一个ajax标准的调用后台呢