Решение для пасты в Opera <= 11.11 - PullRequest
3 голосов
/ 10 июня 2011
$('#sometextarea')
    .change(function(){console.log($(this).val());})
    [0].onpaste=function(){
        var self=$(this);
        var intr=setInterval(function(){
            if(self.val().length) {
                clearInterval(intr);
                self.blur();                                                                    
            }
        },10);                          
    }

onpaste не работает в Opera.

Может кто-нибудь предложить лучшее решение для этой задачи?

Поскольку мне это не нравится, я должен использовать setInterval / setTimeout и эмулировать событие изменения.Потому что если использование triggerHandler('change') вызывает второе событие при размытии пользователя, не знаю почему, на самом деле это не должно происходить по идее, потому что данные не меняются после первого triggerHandler('change')

Требуется решение для захватаval() до того, как пользователь выйдет из текстовой области, следует также захватить пасту мыши.

Ответы [ 2 ]

2 голосов
/ 18 декабря 2011

Я знаю, что это немного поздно для вечеринки, но я работал над записью событий вставки в браузере. Я все еще работаю над кодом, но то, что у меня пока есть, на http://jsfiddle.net/JgU37/42/.

Суть кода ниже:

$(document).ready(function() {
    // Fake paste
    var doFakePaste = false;
    $(document).on('keydown', function(e) {
        $('#status').html('metaKey: ' + e.metaKey + 
                          ' ctrlKey: ' + e.ctrlKey + 
                          ' which: ' + e.which);

        // These browser work with the real paste event
        if ($.client.browser === "Chrome")
            return;
        if ($.client.os === "Windows" && $.client.browser === "Safari")
            return;

        // Check for patse keydown event
        if (!doFakePaste &&
            ($.client.os === "Mac" && e.which == 86 && e.metaKey) ||
            ($.client.os !== "Mac" && e.which == 86 && e.ctrlKey)) {
            doFakePaste = true;
            // got a paste
            if (!$("*:focus").is("input") &&
                !$("*:focus").is("textarea")) {
                $('#status').html('fake paste');

                // Focus the offscreen editable
                $('#TribblePaste').focus();

                // Opera doesn't support onPaste events so we have
                // to use a timeout to get the paste
                if ($.client.browser === "Opera")
                {
                    setTimeout(function() {
                        doFakePaste = false;
                        var html = $('#TribblePaste').html();
                        var text = $('#TribblePaste').text();
                        if (text == '') text = $('#TribblePaste').val();
                        $('#resultA').text('[o] '+html);
                        $('#resultB').text('[o] '+text);
                        $('#TribblePaste').val('');
                        $('#TribblePaste').text('');
                        $('#TribblePaste').blur();
                    }, 1);
                }
            }
        }
    }).on('paste', function (e) {
        // Firefox is not supported - they don't
        // expose the real clipboard
        if ($.client.browser === 'Firefox')
            return;

        $('#status').html('paste event');

        // real pasteing
        var html = '';
        var text = '';
        if (window.clipboardData) // IE
        {  
            text = window.clipboardData.getData("Text");
        }
        if (e.clipboardData && e.clipboardData.getData) // Standard
        {
            text = e.clipboardData.getData('text/plain');
            text = e.clipboardData.getData('text/html');
        }
        if (e.originalEvent.clipboardData &&
            e.originalEvent.clipboardData.getData) // jQuery
        {
            text = e.originalEvent.clipboardData.getData('text/plain');
            html = e.originalEvent.clipboardData.getData('text/html');
        }
        $('#resultA').text(html);
        $('#resultB').text(text);
    });

    // Setup the offscreen paste capture area
    $('<textarea contenteditable id="TribblePaste"></textarea>').css({
        'position': 'absolute',
        'top': '-100000px',
        'width': '100px',
        'height': '100px'
    }).on('paste', function(e) {
        setTimeout(function() {
            doFakePaste = false;
            var html = $('#TribblePaste').html();
            var text = $('#TribblePaste').text();
            if (text == '') text = $('#TribblePaste').val();
            $('#resultA').text(html);
            $('#resultB').text(text);
            $('#TribblePaste').val('');
            $('#TribblePaste').text('');
            $('#TribblePaste').blur();
        }, 1);
    }).appendTo('body');

    $('#data').html('os: ' + $.client.os + ' browser: ' + $.client.browser);
});
1 голос
/ 10 июня 2011

Вы не можете, это просто не поддерживается. Единственный обходной путь, о котором я могу подумать, - это использование setInterval для обнаружения изменений такого рода.

...