jQuery Cleditor wysiwygテキストエディタ：webkitブラウザでkeyup（）は動作しますが、FirefoxやIEでは動作しません。

Question

Cleditorのテキストボックスからのコンテンツを外部HTML要素に表示する方法については、前回のStackoverflowに関する質問をフォローアップしようとしています。 <p>。ここではWebKitのブラウザではなくFirefoxやIEで私の問題を解決しthe questionとthe fiddleだ：私は「window.topを使用する必要があることGet content of iframe from jquery読んだ

<textarea id="input" name="input"></textarea> 
<p id="x"></p> 

<script> 
    $("#input").cleditor(); 

    $(".cleditorMain iframe").contents().find('body').bind('keyup',function(){ 
    var v = $(this).text(); // or .html() if desired 
    $('#x').html(v); 
    }); 
</script> 

：

ここでフィドルからのコードです。 ...すべてのブラウザで.contents（）がサポートされていないため、メインページにアクセスしてその方法で渡します。 "しかし、この目的でwindow.topを使用する方法がわからず、誰かがこのトピックについての光

Answer 1

cleditorのドキュメントは、それが「からkeyup」イベントで動作するように主張し、「変更」イベントを持っていると述べているが、と予想されるように、残念ながら私のテストでは動作しませんでしたFirefox 7（テキストエディタをクリックする必要があります）。

Jsfiddle：http://jsfiddle.net/qm4G6/27/

コード： Get content from jquery CLEditor

：

var cledit = $("#input").cleditor()[0]; 

cledit.change(function(){ 
    var v = this.$area.context.value; 
    $('#x').html(v); 
}); 

ユーザー陵は、独自の機能を追加するプラグインを修正する提案したのと同じものについて尋ねた別のStackOverflowの質問には、もあります

編集： 上記の質問の結果がうまくいかないとのご意見に基づき、以下のコードを修正しました。 これはIE9とIE9の "IE8"開発者モードで動作します。 http://jsfiddle.net/qm4G6/80/

$(document).ready(function(){ 

var cledit = $("#inputcledit").cleditor()[0]; 
$(cledit.$frame[0]).attr("id","cleditCool"); 

var cleditFrame; 
if(!document.frames) 
{ 
    cleditFrame = $("#cleditCool")[0].contentWindow.document; 
} 
else 
{ 
    cleditFrame = document.frames["cleditCool"].document; 
} 

$(cleditFrame).bind('keyup', function(){ 
    var v = $(this).text(); 
    $('#x').html(v); 
}); 

}); 

別の編集：HTMLを取得するには、$(this).find("body").html()のようなのiframe内の体を見つける必要があります。以下のコードを参照してください。 JSFiddle：http://jsfiddle.net/qm4G6/84/

var cledit = $("#inputcledit").cleditor()[0]; 
$(cledit.$frame[0]).attr("id","cleditCool"); 

var cleditFrame; 
if(!document.frames) 
{ 
    cleditFrame = $("#cleditCool")[0].contentWindow.document; 
} 
else 
{ 
    cleditFrame = document.frames["cleditCool"].document; 
} 

$(cleditFrame).bind('keyup', function(){ 
     var v = $(this).find("body").html(); 
     $('#x').html(v); 
}); 

$("div.cleditorToolbar, .cleditorPopup div").bind("click",function(){ 
     var v = $(cleditFrame).find("body").html(); 
     $('#x').html(v); 
}); 

Answer 2

私はこのためにあなたを促さ質問に答えているので、私はあまりにも、このいずれかを答えますね;）

これはChromeとFirefoxの（私はIEへのアクセスを持っていない）で動作します。

$("#input").cleditor(); 

$($(".cleditorMain iframe")[0].contentWindow.document).bind('keyup', function(){ 
    var v = $(this).text(); // or .html() if desired 
    $('#x').html(v); 
}); 

Updated jsFiddle

UPDATE

また、これはChromeとFirefoxで動作します。多分IEも？

$("#input").cleditor(); 

$($(".cleditorMain iframe")[0].contentDocument).bind('keyup', function(){ 
    var v = $(this).text(); // or .html() if desired 
    $('#x').html(v); 
}); 

jsFiddle