質問

jQuery インライン編集プラグインJEDITABLE 。ありがたいことに、 jeditableは、ボックスのインラインを拡張するためのプラグイン機能を提供しますそれを編集する。

ホイールを再発明しないでください。Jeditableに存在しますか?Google-FUが何らかの結果を上げていない場合。

役に立ちましたか?

解決

Jeditable PageDownプラグインに行く準備ができていないので、私は自分のものを書いた。以下の例は、変更なしで使用するにはあまりにも具体的ですが、同様のタスクを達成するために努力している人のためのまともな十分な概要を提供する必要があります。

「マークダウン」入力タイプを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に関しては祝いの束を通過します。詳細については、 PageDown Documentation

「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としてマークダウンを見ることができるので、コールバックとloadurl JEDITABLEパラメータ。ロードURLはMarkDown形式で編集するテキストを取得しますが、コールバックは新しいテキストをHTMLに変換します。

ライセンス: CC-BY-SA帰属
所属していません StackOverflow
scroll top