jquery 删除json list中的数据

最新推荐文章于 2024-03-07 21:21:56 发布

wive

最新推荐文章于 2024-03-07 21:21:56 发布

阅读量1.1w

点赞数

本文链接：https://blog.csdn.net/javadhh/article/details/51372518

版权

前端技术专栏收录该内容

41 篇文章

订阅专栏

这篇博客讲述了如何利用jQuery查找并操作JSON列表，主要涉及在查询群组后检查表格是否存在该数据，若存在则阻止添加并给出提示，最终按顺序将数据存入Redis。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

查找并添加按钮查询出来的群组，判断表格中是否含有，如果含有则添加到表格中，如果存在则提示不添加

// 发起一个ajax请求，访问服务器
$.ajax({
	"url":url,
	"type":"POST",
	"data":{
		"id" : id,
		"adminUser" : adminUser
	},
	"success":function(data) {
		topGroupList = $.fetchReturnValue(data);
		var topGroupListBody = $("#topGroupList", navTab.getCurrentPanel());
		if (topGroupList != null && topGroupList.length > 0) {
			//表格中已有的元素
			var groupIds = [];
			$("#topGroupList").find("tr").each(function(index, domItem){  
		        var gid = parseInt($(domItem).find("td").eq(0).text());  
		        groupIds.push(gid);
		    });
			
			//遍历查询到的元素,因为删除了元素，length变小
			var length = topGroupList.length;
			for(var i = 0 ; i<length ; ){
				var id = topGroupList[i].id;
				//如果查询到的元素已经存在于表格当中，那么从list中删除
				if(jQuery.inArray(id, groupIds) > -1){   //存在表格了,返回位置索引，如果不存在返回-1
					topGroupList.splice(i,1);   //删除一个元素（删除位置，删除数量）
					length -=1; //长度-1
					i = 0;
					$("#success" , navTab.getCurrentPanel()).html("已经存在于表格了...");
				}else{
					i++;
				}
			}
			
			//讲剩余的元素添加到表格当中
			var html = _.template($('#topGroupListTemplate',
					navTab.getCurrentPanel()).html(),
					topGroupList);
			topGroupListBody.append(html);
		}else{
			$("#success" , navTab.getCurrentPanel()).html("没有找到符合条件的群组..");
		}
	},
	"erro":function() {
		alertMsg.error('查询符合条件的群组失败..');
	}
});

操作方法：

//上移
function moveUp(obj){
	var $tr = $(obj).parents("tr");
	if ($tr.index() != 0) {
		$tr.prev().before($tr);
	}
}
	
//下移
function moveDown(obj){
	var trLength = $(obj).parent().parent().siblings().length + 1; 
	var $tr = $(obj).parents("tr"); 
	if ($tr.index() != trLength - 1) { 
		$tr.next().after($tr);
	}
}

/**把这一行记录删除**/  
function removeSelf(obj){  
    $(obj).parent().parent().remove();  
}

understore模板：

<script id="topGroupListTemplate" type="text/template">
<%_.each(topGroupList, function(group,index) {%>
	<tr>
		<td align="center"><%=group.id %></td>
		<td align="center"><img src="<%=group.fullPicture %>" width="50px" height="50px" /></td>
		<td align="center"><%=group.name %></td>
		<td align="center"><%=group.description %></td>
		<td align="center"><%=group.adminUser %></td>
		<td align="center"><%=group.maxMemCount %></td>
		<td align="center"><%=group.curMemCount %></td>
		<td align="center"><%=group.timetag %></td>

		<td align="center">
			<%switch(group.status){
				case 1:%>
					正常
			  		<%break;
				case -1:%>
				  	解散
				 	<%break;
				default:%>
			<%}%>
		</td>
		<td align="center">
			<input type="button" οnclick="moveUp(this)" value="上移"/>  | 
			<input type="button" οnclick="moveDown(this)" value="下移"/>  | 
			<input type="button" οnclick="removeSelf(this)" value="删除"/>
		</td>
	</tr>
<%});%>
</script>

最后按照表格顺序添加数据到redis