http://jsfiddle.net/D6be5/
的HTML
<table class="example" border="1">
<tr>
<td>
<label>Enter text</label>
<textarea>Enter text</textarea>
</td>
</tr>
<tr class="clone"></tr>
</table>
<p><button id="add-row">Add Row</button></p>
jQuery的
$(document).ready(function() {
$(this).on('click', function(event) {
if ( ! $(event.target).closest('table').hasClass('example')) {
$('table label').show();
$('table textarea').hide();
}
});
$('table td').on('click', function() {
$('table label').show();
$('table textarea').hide();
$(this).find('label').hide();
$(this).find('textarea').show();
});
$('#add-row').on('click', function() {
_this = $('table tr.clone')
.clone()
.removeClass('clone')
.insertBefore('.clone');
_this.append('<td><label>Enter text</label><textarea>Enter text</textarea></td>');
});
});
的CSS
table textarea {
display: none;
}
table .clone {
display: none;
}
上面的链接说明了我要做什么。
基本上问题是这样的。我在td中有一个标签和文本区域,该文本区域是隐藏的,只有标签在开始时显示。当用户单击表的单元格时,它会隐藏标签并显示textarea,在您尝试添加该行的克隆之前,该标签工作正常,然后它不会执行任何操作。
编辑:忘记提及为什么我要克隆行并随后添加单元格。在我的实际代码中,我也允许创建列,并且对行进行计数并在其后添加单元格。
非常感谢您的帮助=)
最佳答案
另一种方法。
$('table').on('click', "td", function() {
})
关于javascript - jQuery – on('click')追加似乎无效,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/14133570/