Pregunta

Estoy buscando una forma para limpiar la entrada que me pegue en el navegador, es posible hacer con jQuery?

Me las he arreglado para venir con esta hasta ahora:

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

Por desgracia mi desarrollo ha llegado a un alto debido a este "menor" en el asunto.Yo realmente me hacen feliz que si alguien puede me apunte a la dirección correcta.

¿Fue útil?

Solución 4

En cierto modo me fijo que utilizando el siguiente código:

$("#editor").live('input paste',function(e){
    if(e.target.id == 'editor') {
        $('<textarea></textarea>').attr('id', 'paste').appendTo('#editMode');
        $("#paste").focus();
        setTimeout($(this).paste, 250);
    }
});

Ahora sólo necesito para almacenar la ubicación de intercalación y añadir a esa posición entonces estoy listo ... pienso:)

Otros consejos

bien, sólo tropezó con el mismo problema .. Fui todo el largo camino

$('input').on('paste', function () {
  var element = this;
  setTimeout(function () {
    var text = $(element).val();
    // do something with text
  }, 100);
});

Sólo un pequeño tiempo de espera hasta .val () func puede conseguir poblada.

E.

En realidad se puede agarrar el valor directamente desde el caso . Es un poco obtuso como llegar a él sin embargo.

Vuelta falsa si no quiere que vaya a través.

$(this).on('paste', function(e) {

  var pasteData = e.originalEvent.clipboardData.getData('text')

});

Para la compatibilidad multiplataforma, es preciso manejar oninput y onPropertyChange eventos:

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

Hmm ... piensan Puede utilizar e.clipboardData para atrapar a los datos que se pegan. Si no tiene éxito, tener una mirada rel="noreferrer"> .

$(this).live("paste", function(e) {
    alert(e.clipboardData); // [object Clipboard]
});

detectar el evento pegar y fijar un detector de eventos keyup. En keyup, capturar el valor y retirar el detector de eventos keyup.

$('.inputTextArea').bind('paste', function (e){
    $(e.target).keyup(getInput);
});
function getInput(e){
    var inputText = $(e.target).val();
    $(e.target).unbind('keyup');
}

Esto es cada vez más cerca de lo que es posible que desee.

function sanitize(s) {
  return s.replace(/\bfoo\b/g, "~"); 
};

$(function() {
 $(":text, textarea").bind("input paste", function(e) {
   try {
     clipboardData.setData("text",
       sanitize(clipboardData.getData("text"))
     );
   } catch (e) {
     $(this).val( sanitize( $(this).val() ) );
   }
 });
});

Tenga en cuenta que cuando no se encuentra clipboardData objeto (en los navegadores IE) y luego otros que está recibiendo actualmente llena valor del elemento + el valor clipboard'ed.

Probablemente usted puede hacer algunas medidas adicionales para dif los dos valores, antes de una entrada y después de la entrada, si realmente son sólo después de los datos que estaban realmente pegar en el elemento.

¿Qué hay de comparar el valor original del campo y el valor modificado del campo y la deducción de la diferencia como el valor pegado? Esto atrapa el texto pegado correctamente, incluso si hay un texto existente en el campo.

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);
    });
});
 $('').bind('input propertychange', function() {....});                      

Esto funcionará para el evento de pasta de ratón.

Este código está trabajando para mí pegar de derecha o haga clic en directo copy paste

   $('.textbox').on('paste input propertychange', function (e) {
        $(this).val( $(this).val().replace(/[^0-9.]/g, '') );
    })

Cuando me pegue Section 1: Labour Cost se convierte en 1 en el cuadro de texto.

Para permitir sólo el valor float puedo usar este código

 //only decimal
    $('.textbox').keypress(function(e) {
        if(e.which == 46 && $(this).val().indexOf('.') != -1) {
            e.preventDefault();
        } 
       if (e.which == 8 || e.which == 46) {
            return true;
       } else if ( e.which < 48 || e.which > 57) {
            e.preventDefault();
      }
    });
$("#textboxid").on('input propertychange', function () {
    //perform operation
        });

Se trabajará muy bien.

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

        ...
    }
});

Además:

Vea este ejemplo: http://www.p2e.dk/diverse/detectPaste.htm

Realiza un seguimiento de cada cambio essentialy con oninput evento y luego comprueba si se trata de una pasta mediante la comparación de cadenas. Ah, y en el IE hay un evento onpaste. Por lo tanto:

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

Este método utiliza contenidos jqueries (). Desenvuelva ().

  1. En primer lugar, detectar el evento paste
  2. Añadir una clase única de las etiquetas que ya están en el elemento en el que está pegando.
  3. Después de escanear un tiempo de espera dado a través de todos los contenidos de desenvolvimiento etiquetas que no tienen la clase que se establece anteriormente. Nota: Este método no elimina las etiquetas de cierre automático como
    Ver un ejemplo a continuación.

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

Esto resultó ser bastante ilusoria. El valor de la entrada y no se actualiza antes de la ejecución del código dentro de la función de evento paste. Traté de llamar a otros eventos desde dentro de la función de evento paste pero el valor de entrada aún no se actualiza con el texto pegado dentro de la función de cualquier evento. Es decir todos los eventos aparte de keyup. Si llama keyup dentro de la función de evento paste se puede desinfectar el texto pegado desde dentro de la función de eventos keyup. así ...

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

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

Hay una advertencia aquí. En Firefox, si se restablece el texto de entrada en cada keyup, si el texto es más largo que el área visible permitido por la anchura de entrada, a continuación, restablecer el valor en cada keyup rompe la funcionalidad del navegador que se desplaza de automóviles el texto a la posición de intercalación en el final del texto. En cambio el texto se desplaza de nuevo al principio de dejar el cursor fuera de la vista.

script para eliminar caracteres especiales de todos los campos con la clase portlet-forma-de entrada-campo:

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

Hay una advertencia aquí. En Firefox, si se restablece el texto de entrada en cada keyup, si el texto es más largo que el área visible permitido por la anchura de entrada, a continuación, restablecer el valor en cada keyup rompe la funcionalidad del navegador que se desplaza de automóviles el texto a la posición de intercalación en el final del texto. En cambio el texto se desplaza de nuevo al principio de dejar el cursor fuera de la vista.

function scroll(elementToBeScrolled) 
{
     //this will reset the scroll to the bottom of the viewable area. 
     elementToBeScrolled.topscroll = elementToBeScrolled.scrollheight;
}
Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top