我有一组记录，旁边有一个“编辑”按钮。 我还有一个 div，里面有一个表单。
当我单击“编辑”时，我会显示 div。在 div 内部，我有一个“关闭”按钮，它只需通过 jquery.hide() 关闭 div。当我单击另一条记录的“编辑”按钮时，div 根本不会显示。
我使用其他显示并隐藏在我的代码中的其他元素，它们工作得很好。只有这个我无法工作。
在我的例子中，show() 和 hide() 方法有具体的用法吗？
$('.edit').live('click', function () {
var theid = $(this).attr('id');
$('#' + theid).empty().append($('.rec_edit').show());
if ($('#txt_nowediting_id').val() > 0) {
load_single_rec($('#txt_nowediting_id').val());
};
$('#txt_nowediting_id').val(theid);
return false;
});
$('#btnCancelEdit').click(function () {
$('.rec_edit').hide();
load_single_rec($('#txt_nowediting_id').val());
return false;
});
这里 .rec_edit 是隐藏和显示的 div...
最佳答案
简短回答:在您的#btnCancelEdit点击处理程序中，更改此:
$('.rec_edit').hide();
对此:
$('.rec_edit').hide().appendTo('body');
(或者它最初位于标记中的任何位置，如果不是 body 的话。)否则，我认为您在设置编辑器时对 empty() 的调用会将其清除。
这是一个适合我的完整示例(调整代码以解决不完整的代码，例如 load_single_rec):
<html>
<head>
<script type='text/javascript' src='js/jquery-1.3.2.js'></script>
<script type='text/javascript'>
var editor;
$(document).ready(function() {
$('.edit').live('click', function() {
var theid = $(this).attr('id');
$('#' + theid).empty().append($('.rec_edit').show());
/*
if ($('#txt_nowediting_id').val() > 0) {
load_single_rec($('#txt_nowediting_id').val());
};
*/
$('#txt_nowediting_id').val(theid);
return false;
});
$('#btnCancelEdit').click(function() {
$('.rec_edit').hide().appendTo('body');
// load_single_rec($('#txt_nowediting_id').val());
$('#' + $('#txt_nowediting_id').val()).text('edited!');
return false;
});
});
</script>
</head>
<body>
<form>
<div id='div1' class='edit' style='border: 2px solid #00f;' >
Edit me
</div>
<div id='div2' class='edit' style='border: 2px solid #00f;' >
Edit me too
</div>
<div class='rec_edit' style='display:none; border: 2px solid #f00;'>
Editor
<input type='button' id='btnCancelEdit' value='Cancel' />
</div>
<input type='hidden' id='txt_nowediting_id' />
</form>
</body>
</html>
关于jquery 显示和隐藏功能不起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/1152754/