Поймать паста ввода

Question

Я ищу способ очистки ввода, который я вставляю в браузер, это возможно сделать с помощью jQuery?

Мне уже удалось придумать это:

$(this).live(pasteEventName, function(e) {
 // this is where i would like to sanitize my input
 return false;
}

К сожалению, мое развитие зашло в тупик из-за этой "мелкой" проблемы. Я действительно сделал бы меня счастливым туристом, если бы кто-то мог указать мне правильное направление.

Answer 1

Как насчет сравнения исходного значения поля и измененного значения поля и вычета разности как вставленного значения? Это правильно фиксирует вставленный текст, даже если в поле уже есть текст.

http://jsfiddle.net/6b7sK/

function text_diff(first, second) {
    var start = 0;
    while (start < first.length && first[start] == second[start]) {
        ++start;
    }
    var end = 0;
    while (first.length - end > start && first[first.length - end - 1] == second[second.length - end - 1]) {
        ++end;
    }
    end = second.length - end;
    return second.substr(start, end - start);
}
$('textarea').bind('paste', function () {
    var self = $(this);
    var orig = self.val();
    setTimeout(function () {
        var pasted = text_diff(orig, $(self).val());
        console.log(pasted);
    });
});

Answer 2

document.addEventListener('paste', function(e){
    if(e.clipboardData.types.indexOf('text/html') > -1){
        processDataFromClipboard(e.clipboardData.getData('text/html'));
        e.preventDefault();

        ...
    }
});

Далее:

• API буфера обмена и события

Answer 3

См. Этот пример: http://www.p2e.dk/diverse/detectPaste.htm

Он обязательно отслеживает каждое изменение с помощью события oninput, а затем проверяет, является ли оно вставкой при сравнении строк. О, и в IE есть событие onpaste. Итак:

$ (something).bind ("input paste", function (e) {
    // check for paste as in example above and
    // do something
})

Answer 4

Этот метод использует jqueries contents (). Unwrap ().

1. Сначала определите событие вставки
2. Добавьте уникальный класс к тегам, которые уже находятся в элементе, в который мы вставляем.

3. После определенного времени ожидания просмотрите все теги разворачивания содержимого, которые не имеют класс, который вы установили ранее. Примечание. Этот метод не удаляет самозакрывающиеся теги, такие как
   См. Пример ниже.

   //find all children .find('*') and add the class .within .addClass("within") to all tags
   $('#answer_text').find('*').each(function () {
   $(this).addClass("within");
   });
   setTimeout(function() {
   $('#answer_text').find('*').each(function () {
       //if the current child does not have the specified class unwrap its contents
       $(this).not(".within").contents().unwrap();
   });
   }, 0);
   

Answer 5

Это оказалось довольно призрачным. Значение ввода не обновляется до выполнения кода внутри функции события вставки. Я попытался вызвать другие события из функции вставки события, но входное значение по-прежнему не обновляется вставленным текстом внутри функции каких-либо событий. Это все события, кроме keyup. Если вы вызываете keyup из функции события вставки, вы можете очистить вставленный текст из функции события keyup. вот так ...

$(':input').live
(
    'input paste',
    function(e)
    {
        $(this).keyup();
    }
);

$(':input').live
(
    'keyup',
    function(e)
    {
        // sanitize pasted text here
    }
);

Здесь есть одна оговорка. В Firefox, если вы сбрасываете вводимый текст в каждой клавише, если текст длиннее, чем видимая область, разрешенная шириной ввода, то сброс значения в каждой клавише нарушает функциональность браузера, которая автоматически прокручивает текст в позицию каретки в конец текста. Вместо этого текст прокручивается назад к началу, оставляя курсор вне поля зрения.

Answer 6

Скрипт для удаления специальных символов из всех полей с классом portlet-form-input-field:

// Remove special chars from input field on paste
jQuery('.portlet-form-input-field').bind('paste', function(e) {
    var textInput = jQuery(this);
    setTimeout(function() {
        textInput.val(replaceSingleEndOfLineCharactersInString(textInput.val()));
    }, 200);
});

function replaceSingleEndOfLineCharactersInString(value) {
    <%
        // deal with end-of-line characters (\n or \r\n) that will affect string length calculation,
        // also remove all non-printable control characters that can cause XML validation errors
    %>
    if (value != "") {
        value = value.replace(/(\x00|\x01|\x02|\x03|\x04|\x05|\x06|\x07|\x08|\x0B|\x0C|\x0E|\x0F|\x10|\x11|\x12|\x13|\x14|\x15|\x16|\x17|\x18|\x19|\x1A|\x1B|\x1C|\x1D|\x1E|\x1F|\x7F)/gm,'');
        return value = value.replace(/(\r\n|\n|\r)/gm,'##').replace(/(\#\#)/gm,"\r\n");
    }
}

Answer 7

Здесь есть одна оговорка. В Firefox, если вы сбрасываете вводимый текст в каждой клавише, если текст длиннее, чем видимая область, разрешенная шириной ввода, то сброс значения в каждой клавише нарушает функциональность браузера, которая автоматически прокручивает текст в позицию каретки в конец текста. Вместо этого текст прокручивается назад к началу, оставляя курсор вне поля зрения.

function scroll(elementToBeScrolled) 
{
     //this will reset the scroll to the bottom of the viewable area. 
     elementToBeScrolled.topscroll = elementToBeScrolled.scrollheight;
}