1

我正在使用 ExecCommand 制作一个非常基本的 WYSIWYG 编辑器，因为未来的项目将需要我制作一个（因此请不要告诉我使用 CKEditor 或 tinyMCE 之类的东西）。正常使用时一切正常。但是，如果您输入的词比 iFrame 宽，则该词不会拆分。相反，滚动条只是添加到 iFrame 中。这是一个显示我的问题的视频：https ://vimeo.com/42699618 所以我想知道防止这种情况的最简单方法是什么？

这是代码：

    <script language="JavaScript">
$(document).ready(function(e) { 
    textArea.document.designMode = 'On'; 

    $("#bold").click(makeBold);
    $("#italic").click(makeItalic);

    function makeBold() {
        textArea.document.execCommand('bold', true, null);
        $("#textArea").focus();
    }
    function makeItalic() {
        textArea.document.execCommand('italic', false, null);
        $("#textArea").focus();
    }
});
</script>
<body>

    <iframe id="textArea" style="width: 700px; height:400px;"></iframe>
4

1 回答 1

0

从本质上讲，您现有的系统会处理第一部分，将单词放在新行上。你选择了更简单的版本:)

渲染单词时，需要根据单词的长度和字段的宽度将字符串拆分为多个字符串。

确保您只拆分视图中的单词，而不是数据中的单词！如果用户调整视图大小，您不会想尝试将数据重新组合在一起：p

步骤：每次渲染时，检查每个单词是否超过视图的宽度，如果超过，将其拆分，按顺序渲染碎片，然后继续。

于 2012-05-23T19:31:45.637 回答