JQuery Cleditor получить значение textarea по ключу - PullRequest
Новая
       29

JQuery Cleditor получить значение textarea по ключу

10 голосов
/ 16 октября 2011

Я использую Cleditor http://premiumsoftware.net/cleditor/docs/GettingStarted.html. Я хочу получить значение для keyup и вставить текст в другой div. cleditor поставляется с событием change (), которое я сейчас использую в приведенном ниже примере с jsfiddle, но это не то же самое, что keyup. Я хочу, чтобы div обновлялся по мере ввода. Я попытался использовать keyup, но он не работает.

Вот что у меня сейчас 

$("#input").cleditor().change(function(){
    var v = $('#input').val();
    $('#x').html(v);
})

Проверьте jsfiddle http://jsfiddle.net/qm4G6/11/

Ответы [ 3 ]

17 голосов
/ 16 октября 2011

Похоже, что cleditor скрывает textarea и заменяет его на iframe (см. Строку 203 источника кледитора).

Так что для достижения того, что вы хотите, вам просто нужно получить доступ крезультирующее iframe содержание: 

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

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

Обновлен jsFiddle

ОБНОВЛЕНИЕ для учета комментария Тима

Это работает в Chromeи Firefox (у меня нет доступа к IE): 

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

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

Обновлен jsFiddle

ОБНОВЛЕНИЕ 2

Пользователь ima007 смог найти лучшее кросс-браузерное решение: Текстовый редактор jQuery Cleditor wysiwyg: keyup () работает в браузерах webkit, но не в Firefox или IE

1 голос
/ 21 марта 2012

Мне удалось добиться этого, слегка изменив исходный код редактора - в методе refresh (строка 801) я изменил обработчик события размытия iframe doc.

Предыдущий 

// Update the textarea when the iframe loses focus
    ($.browser.mozilla ? $doc : $(contentWindow)).blur(function() {
      updateTextArea(editor, true);
    });

Изменено до 

// Update the textarea when the iframe loses focus or keyup happens
        ($.browser.mozilla ? $doc : $(contentWindow)).bind('blur keyup', function (e) {
            updateTextArea(editor, true);

            if (options.keyup && e.type === 'keyup')
                options.keyup(editor.$area.val());
        });

и в параметрах, которые передаются во время инициализации, вы можете определить 

$("#element").cleditor({
keyup : function (text) {
 alert(text);
 // do something
}
});

Надеюсь, это кому-нибудь поможет.

Привет

0 голосов
/ 23 января 2014

Вы пытались использовать свойство CLEditor '.doc'?

doc - объект документа, который в данный момент редактируется в iframe. документация для кредитора 

var inputDoc = $("#input").cleditor().doc;

$(inputDoc).keyup(function(){
    var v = $('#input').val();
   $('#x').html(v);
})
...