0

私はエディター（htmlエディター）freetextboxまたはckeditorを含むシステムを構築しています

私の質問 ！

エディターにリンクを貼り付けた後、エディターにリンクを認識させることは可能ですか? たとえば、次のリンクをコピーして貼り付ける場合
http://www.youtube.com/watch?v=uI40vztICwM&feature=g-logo

次に、編集者はYouTubeビデオを再生します

そうでなければ！エディターにコンテンツを貼り付けた後、javascript で処理できるイベントはありますか?

4

3 に答える 3

2

CKEditor にはpaste、エディター インスタンスのイベントがあります。pasteすべてのブラウザーが同じ方法で起動するわけではないため、ネイティブよりもはるかに信頼性が高くなります (Opera はまったくそうではありません)。また、CKEditor の貼り付けイベントの優れた点は、ドキュメントの選択範囲に挿入される前に貼り付けられたデータを変更できることです。

このイベントのドキュメントは次のとおりです: http://docs.ckeditor.com/#!/api/CKEDITOR.editor-event-paste

注: CKEditor の新しいバージョンが 1 週間前にリリースされ、このイベントが変更されたため、CKEditor 4 を使用していることを確認してください。

使用例 (egCKEDITOR.instancesオブジェクトからエディター インスタンスを取得できます。使用しているCKEDITOR.replace()/append()場合は、これらのメソッドによってエディター インスタンスが返されます):

editor.on( 'paste', function( evt ) {
   var data = evt.data;
   data.dataValue = data.dataValue.replace(
       /(http:\/\/[^\s]+)/gi, '<a href="$1">$1</a>' );
   // Text could be pasted, but you transformed it into HTML so update that.
   data.type = 'html';
});
于 2012-12-04T09:40:07.830 に答える
1

以下のコードを持ってください: 

<script>

    CKEDITOR.on('instanceReady', function(e){
     var editor = e.editor;
     editor.on('paste', function(evnt){

     var data = evnt.data;

      // youtube recognize 
       data.dataValue = data.dataValue.replace(/(?:http:\/\/)?(?:www\.)?(?:youtube\.com|youtu\.be)\/(?:watch\?v=)?(.+)/g, '<iframe width="420" height="345" src="http://www.youtube.com/embed/$1" frameborder="0" allowfullscreen></iframe>');

      //image recognize

         data.dataValue = data.dataValue.replace(/(https?:\/\/.*\.(?:png|jpg))/i,'<img src="$1" width="450" height="199" alt="alt description" title="image title" class="image_classes" />');

       alert(data);
       data.type = 'html';


     });
     });


        </script>
于 2012-12-17T20:47:56.733 に答える