请教一个后台表单编辑问题-php教程-PHP中文網

这是从数据库循环读取的文件，怎么点修改，左边对应的内容出现编辑状态？（点第一行编辑，张先生出现编辑框，第二行编辑，陈先生出现编辑框...）这是我写的代码，但是不知道怎么修改对应某行。
php代码
while($row=mysql_fetch_array($result)){

)"/>

}
js代码
<script> <br /> function changeOrderTime(){ <br /> var spanValue = $("#OrderTime").text(); <br /> $("#OrderTimeInput").val(spanValue); <br /> $("#OrderTimeInput").show(); <br /> $("#OrderTime").hide(); <br /> $("#changeOrderTime").hide(); <br /> $("#timeChangeOK").show(); <br /> } <br /></script>

回复讨论(解决方案)

错误太多，也没守规矩
至少需要这样写

<table><tr><td height="30px" align="center"><span id="OrderTime">张先生</span><input type="text" id="OrderTimeInput" style="display:none"/></td><td height="30px" align="center"><input class="changeOrderTime" type="button" value="修改"/><button style="display:none" id="timeChangeOK">确定</button><input type="button" value="删除" onclick="del_oper(1)"/></td> </tr><tr><td height="30px" align="center"><span id="OrderTime">陈先生</span><input type="text" id="OrderTimeInput" style="display:none"/></td><td height="30px" align="center"><input class="changeOrderTime" type="button" value="修改"/><button style="display:none" id="timeChangeOK">确定</button><input type="button" value="删除" onclick="del_oper(2)"/></td> </tr><tr><td height="30px" align="center"><span id="OrderTime">李先生</span><input type="text" id="OrderTimeInput" style="display:none"/></td><td height="30px" align="center"><input class="changeOrderTime" type="button" value="修改"/><button style="display:none" id="timeChangeOK">确定</button><input type="button" value="删除" onclick="del_oper(3)"/></td> </tr></table><script src=scripts/jquery-1.8.3.min.js></script><script>$(function() {  $('.changeOrderTime').click(function() {    var e = $(this).parents('tr');    e.find('#OrderTimeInput').val(e.find('#OrderTime').text());    e.find('#OrderTime').hide();    e.find('#OrderTimeInput').show();    e.find('#timeChangeOK').show();    $(this).hide();  });});</script>

登入後複製

dhtml 中 id 必须唯一，而你没做到
jquery 允许 id 有条件重复，但必须指明上级容器

你可以设置ID，然后通过传参带入，获取INPUT修改后的值

错误太多，也没守规矩
至少需要这样写

<table><tr><td height="30px" align="center"><span id="OrderTime">张先生</span><input type="text" id="OrderTimeInput" style="display:none"/></td><td height="30px" align="center"><input class="changeOrderTime" type="button" value="修改"/><button style="display:none" id="timeChangeOK">确定</button><input type="button" value="删除" onclick="del_oper(1)"/></td> </tr><tr><td height="30px" align="center"><span id="OrderTime">陈先生</span><input type="text" id="OrderTimeInput" style="display:none"/></td><td height="30px" align="center"><input class="changeOrderTime" type="button" value="修改"/><button style="display:none" id="timeChangeOK">确定</button><input type="button" value="删除" onclick="del_oper(2)"/></td> </tr><tr><td height="30px" align="center"><span id="OrderTime">李先生</span><input type="text" id="OrderTimeInput" style="display:none"/></td><td height="30px" align="center"><input class="changeOrderTime" type="button" value="修改"/><button style="display:none" id="timeChangeOK">确定</button><input type="button" value="删除" onclick="del_oper(3)"/></td> </tr></table><script src=scripts/jquery-1.8.3.min.js></script><script>$(function() {  $('.changeOrderTime').click(function() {    var e = $(this).parents('tr');    e.find('#OrderTimeInput').val(e.find('#OrderTime').text());    e.find('#OrderTime').hide();    e.find('#OrderTimeInput').show();    e.find('#timeChangeOK').show();    $(this).hide();  });});</script>

登入後複製

dhtml 中 id 必须唯一，而你没做到
jquery 允许 id 有条件重复，但必须指明上级容器[/quo

错误太多，也没守规矩
至少需要这样写

<table><tr><td height="30px" align="center"><span id="OrderTime">张先生</span><input type="text" id="OrderTimeInput" style="display:none"/></td><td height="30px" align="center"><input class="changeOrderTime" type="button" value="修改"/><button style="display:none" id="timeChangeOK">确定</button><input type="button" value="删除" onclick="del_oper(1)"/></td> </tr><tr><td height="30px" align="center"><span id="OrderTime">陈先生</span><input type="text" id="OrderTimeInput" style="display:none"/></td><td height="30px" align="center"><input class="changeOrderTime" type="button" value="修改"/><button style="display:none" id="timeChangeOK">确定</button><input type="button" value="删除" onclick="del_oper(2)"/></td> </tr><tr><td height="30px" align="center"><span id="OrderTime">李先生</span><input type="text" id="OrderTimeInput" style="display:none"/></td><td height="30px" align="center"><input class="changeOrderTime" type="button" value="修改"/><button style="display:none" id="timeChangeOK">确定</button><input type="button" value="删除" onclick="del_oper(3)"/></td> </tr></table><script src=scripts/jquery-1.8.3.min.js></script><script>$(function() {  $('.changeOrderTime').click(function() {    var e = $(this).parents('tr');    e.find('#OrderTimeInput').val(e.find('#OrderTime').text());    e.find('#OrderTime').hide();    e.find('#OrderTimeInput').show();    e.find('#timeChangeOK').show();    $(this).hide();  });});</script>

登入後複製

dhtml 中 id 必须唯一，而你没做到
jquery 允许 id 有条件重复，但必须指明上级容器

这样一条一条分条写我明白，我是这样举例的，实际数据有几万条，肯定不能这样写吧？只能从数据库循环读取，但是读取出来之后我就不知道怎么用这种方法编辑了，可以做到去另外一个网页去编辑，把ID传过去就可以了。对JS不熟悉，版主可以写一个具体的程序么？

我不过是给个可供测试的例子，用来指出你的代码的问题
从数据库循环读取，并不意味就可以不遵守规则

我知道程序写的有问题，可能是我没问好，PHP代码我本来是写成这样的
while($row=mysql_fetch_array($result)){

)"/>

}
只是单单的把数据从数据库中循环读出来了，因为要添加修改功能，我想用JS实现上面那种的编辑效果，代码不知道怎么写，版主能教下这段代码怎么写么？

示例代码已经给过你了
你写的之所以不成功，原因是你违背的 id 唯一的原则：
循环中
必将重复出现

示例代码已经给过你了
你写的之所以不成功，原因是你违背的 id 唯一的原则：
循环中
必将重复出现[/quote
我懂了，你一开始就回答的很清楚了！对jQuery 遍历 - parents() 方法不清楚，百度了下明白了！

示例代码已经给过你了
你写的之所以不成功，原因是你违背的 id 唯一的原则：
循环中
必将重复出现

在问一个问题，我用同样的方法无法保存修改的数据是为什么
$(function() {
$('.changeOrderTime').click(function() {
var e = $(this).parents('tr');
e.find('#OrderTimeInput').val(e.find('#OrderTime').text());
e.find('#OrderTime').hide();
e.find('#OrderTimeInput').show();
e.find('.timeChangeOK').show();
$(this).hide();
});
});
$(function() {
$('.timeChangeOK').click(function() {
var e = $(this).parents('tr');
e.find('#OrderTime').val(e.find('#OrderTimeInput').text());
e.find('#OrderTimeInput').hide();
e.find('#OrderTime').show();
e.find('.changeOrderTime').show();
$(this).hide();
});
});

你没有提交，怎么保存？

就是想知道点击确定后怎么获取到修改的数据，然后保存到数据库。

你没有提交，怎么保存？

研究出来了，这是我写的完整程序，结贴！
function edit_oper(id){
$('.changeOrderTime').click(function(){
var e = $(this).parents('tr');
e.find('#OrderTimeInput').val(e.find('#OrderTime').text());
e.find('#OrderTime').hide();
e.find('#OrderTimeInput').show();
e.find('.timeChangeOK').show();
$(this).hide();
});
$('.timeChangeOK').click(function(){
var e = $(this).parents('tr');
e.find('#OrderTime').text(e.find('#OrderTimeInput').val());
e.find('#OrderTimeInput').hide();
e.find('#OrderTime').show();
e.find('.changeOrderTime').show();
$(this).hide();
var up = e.find('#OrderTime').text();
$.ajax({
type:"GET",
url:'edit.inc.php?action=oper&id='+id,
data:{operator : up},
success:function(msg){
if(msg == "success"){
alert("修改成功");
history.go(0) ;
}else{
if(msg == "error1"){
alert("修改失败");
return false;
}
}
}
});
});
}