87,910
社区成员
发帖
与我相关
我的任务
分享JQuery动态增加表格行，但是无法获取新增行的属性
test.jsp
insert.js
图中第一行是标题行，是test.jsp中写好的
红框中是动态新增的行，第一个td中都有一个id=delete，但是我点击的时候没有反应，这是怎么回事儿，我该如何做
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//Dth HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>aaaa</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<link rel="stylesheet" type="text/css" href="css/main.css">
<script type="text/javascript" src="js/jquery-2.1.1.js"></script>
</head>
<body>
<br>
<table id="tab" align="center" border="1" width="80%" cellpadding="0" cellspacing="0">
<tbody style="font-size: 14px;text-align: center;">
<tr>
<th width="2%" id="delete">删除</th>
<th>材质</th>
<th>行业</th>
<th>产品</th>
<th>包装</th>
<th>表面处理</th>
<th>仓储费</th>
<th>运费</th>
<th>不含税价</th>
<th>含税价</th>
</tr>
<tr>
<td colspan="8">合计</td>
<td>不含税</td>
<td>含税</td>
</tr>
</tbody>
</table>
</body>
</html>
insert.js
$(function() {
$("#insert").click(function() {
var td_delete = $("<td width='2%' id='delete'>").text("删");
var td_material = $("<td>").text($("#material").find("option:selected").text());
var td_profession = $("<td>").text($("#profession").find("option:selected").text());
var td_category = $("<td>").text($("#category").find("option:selected").text());
var tr = $("<tr>")
var table = $("table:last tr:last");
tr.append(td_delete).append(td_material).append(td_profession).append(td_category);
table.before(tr);
});
$("#delete").click(function() {
alert("您确定要删除所选行？")
/* $(this).parent().parent().remove(); */
});
})图中第一行是标题行，是test.jsp中写好的
红框中是动态新增的行，第一个td中都有一个id=delete，但是我点击的时候没有反应，这是怎么回事儿，我该如何做
...全文
请发表友善的回复…
发表回复
Grimm_1185943116 2016-12-27
- 打赏
- 举报
版主无敌啊
horse_leo_zhcn 2014-12-10
- 打赏
- 举报
版主就是NB，问题解决了！！
xuzuning 2014-12-09
- 打赏
- 举报
$(document).on("click", ".delete", function(){
alert("abd");
})
horse_leo_zhcn 2014-12-09
- 打赏
- 举报
不好意思！我用的是jquery-2.1.1.js，不支持live这个方法了
码无边 2014-12-09
- 打赏
- 举报
$(".delete").live("click",function(){
alert("abd");
})
horse_leo_zhcn 2014-12-09
- 打赏
- 举报
版主你好！根据你的提示，我做了如下修改
$(function() {
$("#insert").click(function() {
var td_delete = $("<td width='2%' class='delete'>").text("删");
var td_material = $("<td>").text($("#material").find("option:selected").text());
var td_profession = $("<td>").text($("#profession").find("option:selected").text());
var td_category = $("<td>").text($("#category").find("option:selected").text());
var tr = $("<tr>")
var table = $("table:last tr:last");
tr.append(td_delete).append(td_material).append(td_profession).append(td_category);
table.before(tr);
});
$(".delete").on("click",function(){
alert("abd");
})
})
Braska 2014-12-09
- 打赏
- 举报
var td_delete = $("<td width='2%'>").text("<a href='javascript:void(0);' onclick='deleteTr(this)'");function deleteTr(obj){
alert("您确定要删除所选行？")
$(obj).parent().parent().remove();
}
闪闪放光芒 2014-12-09
- 打赏
- 举报
你给出供测试代码不全你那个id='insert'的元素在你的html哪里啊
horse_leo_zhcn 2014-12-09
- 打赏
- 举报
能在我的代码上直接给出示例吗？
xuzuning 2014-12-09
- 打赏
- 举报
动态元素不能用 click 绑定，要用 on 绑定
郭梧悠 2014-12-09
- 打赏
- 举报
或者用class
郭梧悠 2014-12-09
- 打赏
- 举报
别用id,用name试试
Braska 2014-12-09
- 打赏
- 举报
id不能冲突。。
