Question

我在桌面上使用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>

Answer 1

事实证明<TD></TD>标签有新行字符和大量空格字符.Data已经存在但由于不需要的额外字符而不可见。希望它可以帮到某人。

jEditable：编辑文本时不显示单元格内容

1 个答案: