想实现JS动态显示DIV层来修改TABLE行的值
比如定了了这么一下DIV层
<div id="youhuaDivTmp" style="display:none">
<table id="youhuaDivTb">
<tr class="optimizationSetBox">
<td colspan="7">
</td>
<td></td>
</tr>
</table>
</div>要求点击下面表格中的立即优化，就在TR下方显示出上面的DIV层来进行修改TD中的值
<TABLE>
<tr>
<td>aaaa</td>
<td><button class="btn btnGreen_c r5" >立即优化</button></td>
</tr>
<tr>
<td>bbbb</td>
<td><button class="btn btnGreen_c r5" >立即优化</button></td>
</tr>
<tr>
<td>cccc</td>
<td><button class="btn btnGreen_c r5" ></button></td>
</tr>
</table>点一下立即优化，就显示出上面定义的DIV来修改AAAA的内容，
不知哪位老师能帮我实现上面的功能，如果功能有写完整包含例子和一些注解我愿意出RMB50 酬谢JavaScript
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>系统在线注册</title>
<script src="Scripts/jquery-1.8.2.min.js"></script>
</head>
<body> <div id="youhuaDivTmp" style="display: none">
<table name="youhuaDivTb">
<tr>
<td>
<input type="text" id="txtNewValue" /></td>
</tr>
<tr>
<td>
<input type="button" name="btnUpdate" value="确认更新" /> </td>
</tr>
</table>
</div>
<table id="testTable">
<tr>
<td>aaaa</td>
<td>
<button class="btn btnGreen_c r5">立即优化</button></td>
</tr>
<tr>
<td>bbbb</td>
<td>
<button class="btn btnGreen_c r5">立即优化</button></td>
</tr>
<tr>
<td>cccc</td>
<td>
<button class="btn btnGreen_c r5">立即优化</button></td>
</td>
</tr>
</table>
<script>
$(function () {
$(".btnGreen_c").click(function () {
$("#testTable").find("table[name='youhuaDivTb']").parents("tr").remove();
var template = $("#youhuaDivTmp").html();
$("<tr><td>" + template + "</td></tr>").insertAfter($(this).parents("tr"));
}); $("input[name='btnUpdate']").live("click", function () {
var newValue = $(this).parents("tr").prev("tr").find("td input").val(); var index = $("#testTable").find("table[name='youhuaDivTb']").parents("tr").index();
$("#testTable tr:eq(" + parseInt(index - 1) + ")").find("td:nth-child(1)").text(newValue); });
})
</script>
</body>
</html>
刚花了点时间帮你写了个demo, 你可以参考下看看是不是你想要的效果。
谢谢大哥，测试了一下基本是我想要的功能，我加了一个关闭DIV的按钮，可是怎么点击了没有效果呢，麻烦再帮我看一下谢谢<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>系统在线注册</title>
<script src="Scripts/jquery-1.8.2.min.js"></script>
<script language="JavaScript" type="text/JavaScript">
function closediv(){
alert("in");//调试用测试是否有调用本函数
document.getElementById("youhuaDivTmp").style.display="none";
}
</script>
</head>
<body> <div id="youhuaDivTmp" style="display: none">
<table name="youhuaDivTb">
<tr>
<td>
<input type="text" id="txtNewValue" /></td>
</tr>
<tr>
<td>
<input type="button" name="btnUpdate" value="确认更新" />
<input type="button" name="myclose" id="myclose" onclick ="closediv()" value="关闭DIV" />
</td>
</tr>
</table>
</div>
<table id="testTable">
<tr>
<td>aaaa</td>
<td>
<button class="btn btnGreen_c r5">立即优化</button></td>
</tr>
<tr>
<td>bbbb</td>
<td>
<button class="btn btnGreen_c r5">立即优化</button></td>
</tr>
<tr>
<td>cccc</td>
<td>
<button class="btn btnGreen_c r5">立即优化</button></td>
</td>
</tr>
</table>
<script>
$(function () {
$(".btnGreen_c").click(function () {
$("#testTable").find("table[name='youhuaDivTb']").parents("tr").remove();
var template = $("#youhuaDivTmp").html();
$("<tr><td>" + template + "</td></tr>").insertAfter($(this).parents("tr"));
}); $("input[name='btnUpdate']").live("click", function () {
var newValue = $(this).parents("tr").prev("tr").find("td input").val(); var index = $("#testTable").find("table[name='youhuaDivTb']").parents("tr").index();
$("#testTable tr:eq(" + parseInt(index - 1) + ")").find("td:nth-child(1)").text(newValue); });
})
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>系统在线注册</title>
<script src="Scripts/jquery-1.8.2.min.js"></script>
<script language="JavaScript" type="text/JavaScript">
function closediv(){
alert("in");//调试用测试是否有调用本函数
document.getElementById("youhuaDivTmp").style.display="none";
}
</script>
</head>
<body> <div id="youhuaDivTmp" style="display: none">
<table name="youhuaDivTb">
<tr>
<td>
<input type="text" id="txtNewValue" /></td>
</tr>
<tr>
<td>
<input type="button" name="btnUpdate" value="确认更新" />
<input type="button" name="myclose" id="myclose" value="关闭DIV" />
<input name="gfind1" id="gfind1" type="button" class="button" value="开始查询" >
</td>
</tr>
</table>
</div>
<table id="testTable">
<tr>
<td>aaaa</td>
<td>
<button class="btn btnGreen_c r5">立即优化</button></td>
</tr>
<tr>
<td>bbbb</td>
<td>
<button class="btn btnGreen_c r5">立即优化</button></td>
</tr>
<tr>
<td>cccc</td>
<td>
<button class="btn btnGreen_c r5">立即优化</button></td>
</td>
</tr>
</table>
<script>
$(function () {
$("#gfind1").click(function() {
// 验证代码
alert("为什么这里无效果呢进不了这里");
});
$("input[name='gfind1']").live("click", function () {
alert("为什么只能用这一句才行");
})
$("input[name='myclose']").live("click", function () {
alert("请输入正确的数字，不要乱输噢");
$("#testTable").find("table[name='youhuaDivTb']").parents("tr").remove();
});
$(".btnGreen_c").click(function () {
$("#testTable").find("table[name='youhuaDivTb']").parents("tr").remove();
var template = $("#youhuaDivTmp").html();
$("<tr><td>" + template + "</td></tr>").insertAfter($(this).parents("tr"));
}); $("input[name='btnUpdate']").live("click", function () {
var newValue = $(this).parents("tr").prev("tr").find("td input").val(); var index = $("#testTable").find("table[name='youhuaDivTb']").parents("tr").index();
$("#testTable tr:eq(" + parseInt(index - 1) + ")").find("td:nth-child(1)").text(newValue); });
})
</script>
</body>
</html>
我新增加了一个按钮 <input name="gfind1" id="gfind1" type="button" class="button" value="开始查询" >
为什么对这个按钮的单击响应事件，只有用
$("input[name='gfind1']").live("click", function () {
alert("为什么只能用这一句才行");
}) 这段才行
用下面这一段正常理解也没错啊，可就是不行，
$("#gfind1").click(function() {
// 验证代码
alert("为什么这里无效果呢进不了这里");
});麻烦看一下这个是为什么谢谢
准确的来说live 一般是用来通过脚本动态的生成的HTML 之后元素来做响应事件的 ，因为是JS动态加的这些元素 所以要用他来绑定。
有空看看吧