我有一个 ruby on rails 应用程序,我使用表格来显示一些数据,然后允许用户通过单击行并弹出相关数据的表单来编辑表格中的数据。当对表单进行更改时,表中的相应行会更新。
表格行点击的事件监听器,显示相应的表单,如下所示:
$('.addable-rows > tbody').on('click', 'tr', function(e){
e.preventDefault();
var fieldset = $($(this).data('id'));
if ($(this).hasClass('selected')){
$(this).removeClass('selected');
fieldset.hide('slow');
} else {
$(this).siblings().removeClass('selected');
$(this).addClass('selected');
fieldset.siblings().hide('slow');
fieldset.show('slow');
}
});
检查表单输入变化并更新表中相应行的侦听器如下所示:
$('.addable_row_host').on('change', ':input', function(){
var fieldset = $(this).closest('fieldset')
var id = fieldset.attr('id')
$('#'+id+'_tr').replaceWith(build_row(fieldset, id));
});
上面引用的构建行方法是:
function build_row(fields, id){
row = $("<tr id='"+id+"_tr' data-id='#"+id+"' class='selected'></tr>");
fields.find('select, input:not([type=hidden])').each(function(){
val = $(this).val();
if(val == null){
val = '';
}else if(val.indexOf(",") !== -1){
val.split(",").join(", ");
}
row.append('<td>'+val+' </td>');
});
return row;
}
这一切都有效,并且在 Chrome/FF/Safari 中非常可爱,但它会导致 IE 最不优雅地刷屏。IE 弹出一个窗口报告崩溃并重新加载页面。没有提及导致控制台问题的原因。此外,此代码中的任何和所有调试语句都会在崩溃前运行并显示在控制台上,因此我无法确定它发生在哪里。
有人知道我错过了什么吗?