Jeditable是否有PageDown插件？

Question

Jeditable是否有PageDown插件？

pluginsmarkdownjeditablepagedown

3

我正在使用jQuery的内联编辑插件Jeditable。值得庆幸的是，Jeditable提供了一个插件能力，可以扩展它提供的开箱即用的内联编辑功能。

我希望不要重复造轮子——因此，是否已经存在适用于Jeditable的PageDown插件？如果有的话，我的谷歌搜索结果并没有找到。

- ahsteele

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- ahsteele · Accepted Answer

我从未找到一个已经准备好的 Jeditable PageDown 插件，所以我写了自己的。下面的示例过于具体，不能直接使用，但应该为任何试图完成类似任务的人提供足够好的大纲。

将“markdown”输入类型添加到 Jeditable 的代码：

var converter = Markdown.getSanitizingConverter();

$.editable.addInputType('markdown', {
    element: function(settings, original) {
        var editorId = original.id.substring(original.id.lastIndexOf("-"));
        var input = $('<textarea />');
        input.attr('id', 'wmd-input' + editorId);

        var panel = $('<div class="wmd-panel" />');
        panel.append('<div id="wmd-button-bar' + editorId + '" />');
        panel.append(input);
        panel.append('<div id="wmd-preview' + editorId + '" />');

        $(this).append(panel);
        return (input);
    },
    plugin: function(settings, original) {
        var editorId = original.id.substring(original.id.lastIndexOf("-"));
        var editor = new Markdown.Editor(converter, editorId);
        editor.run();
    }
});

上述代码对元素id进行了一系列的操作，因为在我的情况下，一个页面上可能有多个编辑器。有关Markdown.Editor的更多详细信息，请参见PageDown文档。

一旦我将“markdown”输入类型添加到Jeditable中，就只需要使用以下代码来利用它：

$('.editable-element-area').editable('http://jsfiddle.net/echo/jsonp/', {
    onblur: 'submit',
    type: 'markdown',
    indicator: 'Saving...',
    loadurl: 'http://jsfiddle.net/echo/jsonp/', // retrieve existing markdown
    callback: function(value, settings) {
        $(this).html(converter.makeHtml(value)); // render updated markdown
    }
});

我希望我的用户在不编辑时能够以HTML格式查看Markdown，因此我必须利用回调和loadurl Jeditable parameters。 load url检索以markdown格式编辑的文本，而回调将新文本转换回html。