我在桌面上使用jEditable插件。它工作正常,但在编辑任何单元格时,其内容消失(它只显示没有值的普通输入文本框),一旦完成编辑并点击回车,它就会显示完整的文本(现有文本+编辑的文本)。这是代码片段 -
<script type="text/javascript" src="media/js/jquery.min.js"></script>
<script src="media/js/jquery.dataTables.js"></script>
<script type="text/javascript" language="javascript" src="media/js/jquery.dataTables.min.js"></script>
<link rel="stylesheet" type="text/css" href="extensions/TableTools/css/jquery.dataTables.css">
<link rel="stylesheet" type="text/css" href="extensions/TableTools/css/jquery.dataTables.min.css">
<link href="media/css/jquery.dataTables.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<link rel="stylesheet" href="css/bootstrap.min.css">
<script src="extensions/Plugins/integration/bootstrap/3/dataTables.bootstrap.js"></script>
<link rel="stylesheet" href="css/bootstrap-theme.min.css">
<link rel="stylesheet" href="css/resultTable.css">
<script type="text/javascript" src="js/jquery.jeditable.js"></script>
<style>
article, aside, figure, footer, header, hgroup,
menu, nav, section { display: block; }
</style>
<!--[if IE]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<script>
$(document).ready(function() {
$('#dbResultsTable').DataTable( {
"bJQueryUI": true,
"sPaginationType": "full_numbers" ,
"paging": true,
"ordering" : true,
"scrollY":false,
"autoWidth": false,
"info": true ,
"scrollX": "100%" ,
"sScrollXInner": "110%",
"lengthMenu": [[5,10, 25, 50, -1], [5,10, 25, 50, "All"]],
columnDefs: [
{ "type": "html-string", "targets": 1 },
{ "type": "html-string", "targets": 2 },
{ "type": "html-string", "targets": 3 },
{ "type": "html-string", "targets": 4 },
{ "type": "html-string", "targets": 5 }
],
"dom": '<"top"iflp<"clear">>rt<"bottom"iflp<"clear">>'
}
);
});
</script>
<script>
$(document).ready(function() { /* Init DataTables */
var oTable = $('#dbResultsTable').dataTable();
var theCallback = function(v, s) {
return v;
};
$(oTable).find('td').editable(theCallback, {
"callback": function(sValue, y) {
oTable.fnUpdate(sValue);
},
});
});
</script>
<style>
table { table-layout: auto; }
table {
white-space: nowrap;
}
</style>
<style type="text/css">
td{
text-align:center;
}
</style>
</head>
答案 0 :(得分:0)
事实证明<TD></TD>
标签有新行字符和大量空格字符.Data已经存在但由于不需要的额外字符而不可见。希望它可以帮到某人。