javascript - CKEditor 表宽和列宽单位

Question

我目前正在测试 CKEditor。

特别是表格调整大小和表格插件的功能。

到目前为止我发现它似乎有时与 pt 一起工作，有时与 px 一起工作。

有没有一种方法可以更改行为以始终使用百分比或某种其他类型的相对比率而不是列宽的 px 或 pt？

<table border="1" cellpadding="1" cellspacing="1" style="width:1340px">
    <thead>
        <tr>
            <th scope="col" style="width:386px">1</th>
            <th scope="col" style="width:953px">
            <p>2</p>
            </th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td style="width:386px">3</td>
            <td style="width:953px">4</td>
        </tr>
    </tbody>
</table>

我原来的帖子是在http://ckeditor.com/forums/CKEditor/CKEditor-Table-Width-and-Column-Width-Units .我决定将它张贴在这里，因为两天没有关于我的问题的事件。

我正在寻找一种简单的方法来通过配置或通过 JavaScript 以编程方式调整 CKEditor 中的表格插件，以将单位从像素更改为例如百分比或任何其他相关单位。

更新

我想要的是用户在所见即所得中看到的表格在编辑时例如是 100% 宽度。当用户更改列时，他们会以百分比而不是像素为单位进行更改。或者用户使表格小于总宽度的 100%。然后表格以 % 而不是 px 的形式更改。

Answer 1

似乎没有更改此行为的配置设置，编辑插件本身可能有点令人头疼。

您可以简单地为表格指定一个百分比宽度，其余部分保持原样。大多数现代浏览器都会按比例处理/调整单元格的大小。您可以使用 jquery 或什至使用简单的 CSS 声明强制执行此操作。例如:$("table").width("100%");，或者 table { width: 100% !important; 。

或者，您可以使用 jquery 获取当前宽度并将它们更改为百分比，例如类似于此的内容:

var tableWidth = $("table").width();
$("table tr").children().each(function( index ) {
    $(this).width(Math.round(100 * $(this).width() / tableWidth)+"%");
});

$("table").width("100%");

var tableWidth = $("table").width();
$("table tr").children().each(function( index ) {
    $(this).width(Math.round(100 * $(this).width() / tableWidth)+"%");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table border="1" cellpadding="1" cellspacing="1" style="width:1340px">
    <thead>
        <tr>
            <th scope="col" style="width:386px">1</th>
            <th scope="col" style="width:953px">
            <p>2</p>
            </th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td style="width:386px">3</td>
            <td style="width:953px">4</td>
        </tr>
    </tbody>
</table>

有关如何使用类名添加它以专门针对 CKEditor 表的一些信息，请参阅: https://stackoverflow.com/a/7980775/2126792