Перемещение фокуса при вставке текста
Есть событие paste, которое должно работать во всех браузерах последних версий, но на практике игнорируется в IE и есть странность в FireFox.
jQuery работает с ним посредством $('element').on('paste', function(){}); Замысел заключается в очистке форматирования вставляемого текста в div contenteditable. 1. Следим за событием paste в нашем div. 2. Запоминаем позицию курсора в div. 3. Перемещаем фокус в textarea, в котором текст вставится без форматирования. 4. Ставим небольшой таймаут. В это время текст из буфера обмена наконец попадает в textarea. 5. В полученном тексте убиваем два или более пробелов подряд, убиваем два или более переноса строк подряд, преобразуем переносы строк \n в <br>\n (т.е. визуально готовим текст для возврата в div). 6. Восстанавливаем позицию курсора в div. 7. Возвращаем уже простой текст обратно в div, в то место, куда вернули курсор. Посмотреть в действии: http://jsfiddle.net/rafaylik/4k5rg/ Проблемы, которые хотелось бы решить: 1. IE (проверял в 10) совсем игнорирует наше событие paste и дефолтно вставляет форматированный текст. 2. В FireFox textarea получает фокус, но не получает текст из буфера обмена, то есть текст не попадает ни в div, ни в textarea. Возможно ли вообще сделать решение кроссбраузерным (для последних версий)? Вот та актуальная часть примера, которая переводит фокус: <div id="format" contenteditable="true">Вставленный сюда текст преобразуется из форматированного в простой.</div> <textarea id="plain">Сюда перенаправляем фокус и ловим текст</textarea> $('#format').on('paste', function(){ $('#plain').val('').focus(); }); |
В последней версии firefox есть объект clipboardData. Он же есть в IE и WebKit
|
Цитата:
https://developer.mozilla.org/en-US/..._the_Clipboard |
clipboardData.getData() работает отлично, код получился короче, и фокус никуда не нужно перемещать.
Пример в действии (для Chrome, Safari, Firefox, Opera): http://jsfiddle.net/rafaylik/YMQPK/ Не получилось только в IE10 ловить событие paste, просто бубна под рукой нет ) А IE11 paste понимают, но с clipboardData работает как-то иначе, нужно разобраться будет.. |
Часовой пояс GMT +3, время: 12:16. |