js函数必须在alert某元素执行后才能执行

	$.post("queryAllPipe.do", function(list){
		$("#pipeVisual").children().remove();
		var tbody = "";
		$.each(list, function(n, value) {
			var trs = "";
			trs += " <tr> <td> " + value.id + " </td> <td>" + value.pipeModelNumber + "</td><td>" + 
			value.pipeStandard + "</td><td>" + value.pipeAmount + "</td>" + 
			"<td><div class='btn-group'><a href='#' class='btn btn-default'>修改</a><a href='#' class='btn btn-danger' name='deletePipe'>删除</a></div></td>" + "</tr>";  
			tbody += trs;
		});
		$("#pipeVisual").append(tbody);
	});
	
	alert($("[name='deletePipe']"));
	//下面的事件必须在上面alert一下ajax动态添加的元素才能注册执行
	$("[name='deletePipe']").on("click", function(){
		
		var tr1 = $(this).parents("tr:first");
		var pipeId = tr1.find("td:first-child").text();	//获取要删除订单的钢管id
		$.post("deletePipe.do", {pipeId:pipeId}, function(e){
			tr1.remove();
		});
	});

如图所示,多数原因为界面ajax中动态添加的元素还没被添加上,就执行了js函数(js函数要调用动态元素)。解决办法: ajax方法中添加 async:false 。作用为,在ajax执行完毕后才执行之后的js。

猜你喜欢

转载自blog.csdn.net/qq_37796475/article/details/79821784