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

как насчет этого: http://jsfiddle.net/5bNx4/

пожалуйста, используйте .on Если вы используете jq1.7 и др.

поведение: когда вы вводите что-либо или paste что-нибудь на 1-й текстовой области teaxtarea ниже захватывает cahnge.

остальное я надеюсь, что это помогает делу. :)

Полезные ссылки =>

как вы обрабатываете oncut, oncopy и onpaste в jQuery?

вставить ловить вход

код

$(document).ready(function() {
    var $editor    = $('#editor');
    var $clipboard = $('<textarea />').insertAfter($editor);

    if(!document.execCommand('StyleWithCSS', false, false)) {
        document.execCommand('UseCSS', false, true);
    }

    $editor.on('paste, keydown', function() {
        var $self = $(this);            
        setTimeout(function(){ 
            var $content = $self.html();             
            $clipboard.val($content);
        },100);
     });
});

Мне недавно нужно было сделать что-то подобное этому. Я использовал следующий дизайн для доступа к элементу вставки и значению. демо jsFiddle

$('body').on('paste', 'input, textarea', function (e)
{
    setTimeout(function ()
    {
        //currentTarget added in jQuery 1.3
        alert($(e.currentTarget).val());
        //do stuff
    },0);
});

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

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);
    });
});

$(document).ready(function() {
    $("#editor").bind('paste', function (e){
        $(e.target).keyup(getInput);
    });

    function getInput(e){
        var inputText = $(e.target).html(); /*$(e.target).val();*/
        alert(inputText);
        $(e.target).unbind('keyup');
    }
});

похоже, что это событие имеет некоторые clipboardData свойство, прикрепленное к нему (оно может быть вложено в originalEvent свойства). Элемент clipboardData содержит массив элементов, и каждый из этих предметов имеет getAsString() функция, которую вы можете вызвать. Это возвращает строковое представление того, что в элементе.

эти элементы также имеют getAsFile() функция, а также некоторые другие, которые являются специфичными для браузера (например, в браузерах webkit есть webkitGetAsEntry() функция.)

для моих целей, мне нужно строковое значение, что наклеено. Итак, я сделал что-то подобное:

$(element).bind("paste", function (e) {
    e.originalEvent.clipboardData.items[0].getAsString(function (pStringRepresentation) {
        debugger; 
        // pStringRepresentation now contains the string representation of what was pasted.
        // This does not include HTML or any markup. Essentially jQuery's $(element).text()
        // function result.
    });
});

вы хотите выполнить итерацию через элементы, сохраняя результат конкатенации строк.

тот факт, что есть массив элементов, заставляет меня думать, что нужно будет сделать больше работы, анализируя каждый элемент. Вы также хотите сделать некоторые проверки null / value.

эта работа на всех браузерах, чтобы получить вставленное значение. А также к созданию общего метода для всех текстовых полей.

$("#textareaid").bind("paste", function(e){       
    var pastedData = e.target.value;
    alert(pastedData);
} )

другой подход: Это input событие будет ловить также paste событие.

$('textarea').bind('input', function () {
    setTimeout(function () { 
        console.log('input event handled including paste event');
    }, 0);
});