Jquery / JS bind "paste" event handler to input textbox

Question

Allright, SO i have an input box and I need to do things everytime it changes, I am having trouble doing it for mouse paste. Here is the code I have

$("#attack-navy"+unit.ID+"-number").bind('paste', function(){
            alert("paste detected");
            $("#attack-max-capacity").text(getMaxCapacity());
});

the getMaxCapacity() function return number entered * 30 for now;

Here is the scenario when
1: I paste 3, it will not change (i still see the alert)
2: Then when i paste 5, it will be 90(3 * 30)
3: Then if i paste 10 it will be 150(5 * 30), and so on.

I think its doing the handler before the paste actually occurs. Any ideas on what I can do? (.change will not work, it must happen as soon as u paste)

score 45 · Accepted Answer · answered Mar 11 '11 at 21:59

45

You should handle the input and propertychange events.
Demo.

answered Mar 11 '11 at 21:59

SLaks

868,454
176
1,908
1,964

Would propertychange require me to leave focus? – Ave Mar 11 '11 at 22:06
I tried .bind('propertychange', function(){ ... doesnt seem to work – Ave Mar 11 '11 at 22:12
3

@Ave: `propertychange` is only for IE. For other browser, you need `input`. – SLaks Mar 11 '11 at 22:12
1

Oh wow, i never knew i had to do .bind('input', handler) THat is amazing, its weird I search so much but never heard of it before Thanks a lot!! – Ave Mar 11 '11 at 22:16
This answer would answer a lot of similar questions... :D – Leniel Maccaferri Apr 26 '11 at 03:51
Can anyone tell me which minimum versions of different browsers will support this code? – SexyBeast Jan 19 '13 at 14:08
@Cupidvogel: AFAIK, all of them. I'm not sure, though. – SLaks Jan 20 '13 at 14:02
This stuff will not catch changes made by code: $("myInput").val("") - non of this events will be triggered. – Pavel Shkleinik Sep 28 '13 at 11:31

score 3 · Answer 2 · answered Mar 11 '11 at 22:01

3

You're right. The paste event is firing before the value of the input changes. Try wrapping your handler in a timeout:

setTimeout(function() { $("#attack-max-capacity").text(getMaxCapacity()); }, 0);

answered Mar 11 '11 at 22:01

tilleryj

14,259
3
23
22

score 1 · Answer 3 · edited Jul 10 '11 at 10:58

1

Replace the bind event with .live and it should work, like this:

$("#attack-navy"+unit.ID+"-number").live('paste', function(){
            alert("paste detected");
            $("#attack-max-capacity").text(getMaxCapacity());
});

edited Jul 10 '11 at 10:58

takrl

6,356
3
60
69

answered Jul 09 '11 at 18:47

karev

11
1

Jquery / JS bind "paste" event handler to input textbox

3 Answers3

Linked

Related