1

gem 'bootstrap-wysihtml5-rails', '0.3.1.13' を使用しています。フォーカスが失われたときに、変更された内容をテキストエリアから保存したいと考えています。

スクリプトタグで囲まれたビューでjqueryを直接使用しようとしました：

$("textarea").live("blur", function(){ alert("Focus lost"); });

「ぼかし」（またはフォーカスアウト）を使用すると、ページの読み込み時にアラートが数回トリガーされますが、フォーカスを失ったときではなく、「変更」を使用しても何も起こりません。

別の試みで、同じ動作で wysihtml5-event にフックしようとしました:

function integrate_wysihtml5() {
var editor = $('.wysihtml5').each(function(i, elem) {
    $(elem).wysihtml5({
        "font-styles": false, //Font styling, e.g. h1, h2, etc. Default true
        "emphasis": true, //Italics, bold, etc. Default true
        "lists": true, //(Un)ordered lists, e.g. Bullets, Numbers. Default true
        "html": false, //Button which allows you to edit the generated HTML. Default false
        "link": false, //Button to insert a link. Default true
        "image": false, //Button to insert an image. Default true,
        "color": false //Button to change color of font  
    });
});

function onChange() { alert("The content of the editor has changed"); };
editor.on("change", onChange);

}

4

3 に答える 3

2 
$('.textarea').wysihtml5({
    events: {
        change: function() {
            var html = this.textarea.getValue();
            //ajax method
        }
    }
}
于 2013-01-22T13:04:44.277 に答える
0

変更イベントをキャッチする良い方法:

editor.composer.element.addEventListener("keyup", myOnChange);
editor.on("aftercommand:composer", myOnChange);

しかし、私はあなたのそれぞれが良いとは思いません.wysihtml5は複数の編集可能な部分で動作するように作られていません.ここではブートストラップ版を使用していますが、同じだと思います. それが主に私がjquery.scribeを書く理由です

だから、多分そのような？

$('.wysihtml5').each(function(i, elem) {
    var editor = $(elem).wysihtml5({
        "font-styles": false, //Font styling, e.g. h1, h2, etc. Default true
        "emphasis": true, //Italics, bold, etc. Default true
        "lists": true, //(Un)ordered lists, e.g. Bullets, Numbers. Default true
        "html": false, //Button which allows you to edit the generated HTML. Default false
        "link": false, //Button to insert a link. Default true
        "image": false, //Button to insert an image. Default true,
        "color": false //Button to change color of font  
    });

    editor.composer.element.addEventListener("keyup", myOnChange);
    editor.on("aftercommand:composer", myOnChange);
});
于 2013-01-22T13:18:22.350 に答える