0

こんにちは、私はmouseleaveここで jquery イベントに取り組んでいますckeditor。マウスに入ったときに表示する必要がckeditorあり、マウスがここを離れたときに発火する必要があります。私はそれをしました。

入力すると表示され(最初の画像)、ckeditorテキストを書き、フォントを適用すると(2番目の画像)、発射手段ckeditorが非表示になります(3番目の画像)。別のdivでフォントを開くと思いますが、マウスがckeditordivを離れたら起動する必要があります。

ここに私のコードがあります:

     <script type="text/javascript">
    $(document).ready(function () {

        $('#btndiv1').hide();

        $('#btndiv').hover(function () {
            $('#btndiv1').show();
        });
        });
</script>
<script type="text/javascript">
    $(document).ready(function () {
    var editor = CKEDITOR.editor.replace('editor1');
    $('#btndiv').mouseleave(function (event) {
        $('#btndiv1').hide("slow");
            alert(1);
            var value = editor.getData();
            alert(value);
            $('#btndiv').append(value);

        });
    });

       </script>

ここに私のhtmlコード:

    <div id="btndiv" style="height:400px;width:800px; border:1px solid ">
    <div id="btndiv1" style="height:auto;width:auto; border: 1px solid  ;">
    <textarea  rows="10"   id="editor1"> </textarea>

        </div>
</div>

これは、マウスが入力されたときのckeditorです

ここに画像の説明を入力

そして、これはフォントを適用するための選択です

スタイルを選択したとき

そしてここで発射されます

ここに画像の説明を入力

しかし、ユーザーが自分のテキストのデザインを完了したときにそれを起動する必要があります。これどうやってするの?助けていただければ幸いです。

4

1 に答える 1

0

CKEditorは、DOMの最後、本文の終了タグの直前に、フォントピッカーのようなフローティングボックスを追加します。したがって、これはdiv#btndiv1の外部にあるため、mouseleaveイベントが発生します。

追加されたdivには常に同じクラス「cke_skin_kama」があるため、エディターを非表示にする前に、このdivを使用しているかどうかを確認できます。

このようなもの(テストされていません):

$('#btndiv').mouseleave(function (event) {
    if (!event.toElement.hasClass('cke_skin_kama')) {
        $('#btndiv1').hide("slow"); 
    }
});
于 2012-10-31T11:24:50.657 に答える