Jquery Mobile Paste event on input text

问题

I'm using Jquery Mobile to develop an web app for Android and iPhone. I want to handle the event when the users change their value in the input text field.

Initially, I use .on("keyup change") and everything seem to work ok. However, when the users paste some text on the text field (by holding and tap on the "Paste"), my event handler is not called.

Please help me if you know how to solve this problem.

Thank you all.

回答1:

Works on all browsers but not on FireFox.

Demo

$('input').on('paste', function (e) {
 if (e.originalEvent.clipboardData) {
  var text = e.originalEvent.clipboardData.getData("text/plain");
  $('p').empty();
  $('p').append(text);
 }
});

Credit goes to: jQuery Detect Paste Event Anywhere on Page and "Redirect" it to Textarea

回答2:

1. For Android add a timeout as it is in this example http://ajax911.com/numbers-numeric-field-jquery/

2. For iPad add event 'change' together with paste, worked on iphone

回答3:

Here is what worked for me on mobile Safari and Chrome.

if (document.getElementById('search_input')) {
    document.querySelector('#search_input').addEventListener('paste', (e) => {

        let pasteData = (e.clipboardData || window.clipboardData).getData('text');
        pasteData = pasteData.replace(/[^\x20-\xFF]/gi, '');
        window.setTimeout(() => {
            //do stuff
        });
    });
}

来源：https://stackoverflow.com/questions/16219926/jquery-mobile-paste-event-on-input-text