jquery 最小富文本框插件

发布于 2025-01-02 15:50:17 字数 371 浏览 2 评论 0原文

我正在为我正在开发的 Web 应用程序寻找一个非常小的 jQuery 富文本框插件。

用户只需要看到“文本框”,而不需要看到任何工具栏,因为所有丰富的格式都将根据他们输入的内容进行编码。

我尝试使用 iframe 创建自己的 iframe,但存在问题。其中之一是当将字符串包装在 div 中时,插入符号会移动到开头,并且如果不单击,则无法在 div 内移动它。 http://jsfiddle.net/DVjYa/

这是一个问题,因为我需要它像普通文本框一样运行。在普通文本框中,您可以使用箭头键进行导航,而无需单击。因此,为什么我正在寻找一个已经克服这些问题的插件。

I am looking for a very minimal jQuery rich textbox plugin for a web app I am working on.

The user will only need to see the 'textbox', and not any toolbars as all of the rich formatting will be coded depending on what they type.

I have attempted to create my own with an iframe, but there are problems. One of them being when wrapping strings in divs, the caret is moved to the beginning and it can't be moved inside the div without clicking. http://jsfiddle.net/DVjYa/

This is a problem because I need it to behave like a normal textbox. In a normal textbox, you would be able to navigate with the arrow keys without having to click. Hence why I am looking for a plugin which has already overcome these problems.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

2025-01-09 15:50:18
var editorDoc;

$(function() {
    var editor = document.getElementById ("editable");

    if (editor.contentDocument) {
        editorDoc = editor.contentDocument;
    } else {
        editorDoc = editor.contentWindow.document;
    }

    var editorBody = editorDoc.body;
    if ('contentEditable' in editorBody) {
        // allow contentEditable
        editorBody.contentEditable = true;
    }
    else {  // Firefox earlier than version 3
        if ('designMode' in editorDoc) {
            // turn on designMode
            editorDoc.designMode = "on";                
        }
    }
});
var editorDoc;

$(function() {
    var editor = document.getElementById ("editable");

    if (editor.contentDocument) {
        editorDoc = editor.contentDocument;
    } else {
        editorDoc = editor.contentWindow.document;
    }

    var editorBody = editorDoc.body;
    if ('contentEditable' in editorBody) {
        // allow contentEditable
        editorBody.contentEditable = true;
    }
    else {  // Firefox earlier than version 3
        if ('designMode' in editorDoc) {
            // turn on designMode
            editorDoc.designMode = "on";                
        }
    }
});
执妄 2025-01-09 15:50:18

将添加另一个答案,尽管帖子有点旧

Trumbowyg 一个轻量级且令人惊叹的 WYSIWYG JavaScript 编辑器 - 仅 15kB (来自 github 页面

will add another answer although post is a little old

Trumbowyg A lightweight and amazing WYSIWYG JavaScript editor - 15kB only (from github page)

若能看破又如何 2025-01-09 15:50:17

您可以使用非常轻量级的CLEDITOR。您可以禁用所有工具栏按钮并隐藏工具栏。除此之外,它还允许您使用键盘快捷键 (CTRL+B/CTRL+I) 进行粗体/斜体选择,即使工具栏不存在也是如此。

演示:http://jsfiddle.net/Rft3A/

You can use CLEDITOR which is very lightweight. You can disable all the toolbar buttons and hide the toolbar as well. In addition to this, it lets you make the selection bold/italic using keyboard shortcuts (CTRL+B/CTRL+I) even though the toolbar does not exist.

Demo: http://jsfiddle.net/Rft3A/

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文