bind to every keypress but paste - javascript

I'm using jquery copy paste methods to do something when text is pasted into my text area
$(function(){
$("#input").bind({
paste : function(){
show_ln();
$("#t2").scrollTop($("#input").scrollTop());
}
});
});
But I want to do something else when any other keypress within #input is done.
$("body").on("keypress", "#input", function(){
show_ln();
});
Is there any way to bind that second keypress to everything but a paste?

Yes you can use keyup event instead or lookup for the keyCode in keypress listener.
$("body").on("keyup", "#input", function(event){
// For the case paste also fires this event you can have a look on keyCode.
if(event.keyCode!=="NUMBER_OF_PASTE"){
show_ln();
}
});

Related

Allowing child element to continue/trigger an event using jQuery

I have this code against the document object:
$(document).on('keydown', function(event) {
event.preventDefault();
});
Is it possible to put an exception on a child <textarea> element for example and allow the keydown to proceed as normal on that child?
As per CBroe's input, the solution was to call stopPropagation() when the element to have an exception calls the keydown event:
$('textarea').on('keydown', function(event) {
event.stopPropagation();
});

How to call a keypress event by Jquery without pressing any keys

I would like to realize a keypress event for typing a string into an input elements by Jquery, I know Jquery can listen the event of keypress, keydown and keyup. But, what I want to do is using the Jquery to realize the action of keypress and put the value of which key I pressed into the input elements. Is that possible by jQuery to realize this task?
Is this what you want?
WORKING FIDDLE
$('.input').on('keypress', function(event) {
event.preventDefault();
$(this).val(event.keyCode);
});
$( ".input" ).trigger( "keypress" );
// Target input element and bind to the "keyPress" event.
$('.input').on('keypress', function(event) {
// Prevent the default action to stop the key character being entered into the field
event.preventDefault();
// Add the event's keyCode into the field
$(this).val(event.keyCode);
})
http://codepen.io/anon/pen/XXNOQd?editors=101

How to detect when a textarea value is changed by a script?

I would like to check a textarea when the value inside it is changed by program.
The code is quite complex so I would rather use an event listener instead of looking for the exact line of code.
Here is how I check:
$(".edit.btn.btn-default").on("click", function(){
alert($("#attribute_fabric_en").val());
$("#attribute_fabric_en").on("input propertychange",function(){
alert("test");
});
});
The result: alert($("#attribute_fabric_en").val()); prints an empty string, but the textarea later on will be assigned a value by script; but the listener is not triggered.
At least Chrome tested is not work to capture the event
There is an event for that, in jQuery you can use $('.textareaId').on('change', console.log($('#textareaId').html()), It is that simple !
EDIT:
Maybe you don't want to use jQuery, click event is for textarea, contentediatble divs, etc and input event is for form elements such as
textArea.addEventListener('change', function(e){ ... }, false);\n
inputElement.addEventListener('input', function(e) { ... }, false);

Simulate keypress with jQuery on form element

I'm trying to simulate a keypress with the below code...
jQuery('input[name=renameCustomForm]').live('keyup', function (e) {
console.log('pressed');
});
jQuery('body').click(function (e) {
console.log(jQuery('input[name=renameCustomForm]'));
var press = jQuery.Event("keypress");
press.which = 13;
jQuery('input[name=renameCustomForm]').trigger(press);
});
I got this code from other posts on SO, but it doesn't work. Anyone know why?
Update
Fixed it... it appears triggering "keypress" doesn't automatically trigger "keyup"
Normally, when a user adds something to an inout field, the following events occur:
keydown (once).
keypress (at least once, additional events uccur while the key is pressed down)
keyup (once)
When a key event is simulated, it's not necessary that all events occur in this order. The event is manually dispatched, so the normal event chain isn't activated.
Hence, if you manually trigger the keypress event, the keyup event won't be fired.
You code will trigger a keypress each time you click anywhere on the page..
For your case it might be better to use the .blur() event of the input box..
jQuery('input[name=renameCustomForm]').live('keyup', function (e) {
console.log('pressed');
}).live('blur', function(){
var self = $(this);
console.log( self );
var press = jQuery.Event("keyup");
press.which = 13;
self.trigger( press );
});

keydown on checkbox doesn't bubble in FF, but it does in IE. How to solve?

Using jQuery, I bind keydown globally like this:
$(document).bind('keydown', function(e) { alert('keydown fired'); });
When I press a key having focused a text input field, the alert shows just fine. But when I focus a checkbox and then press a key, it does not fire. Not even with the keypress event. Why do these events not bubble up to the document? They do in Internet Explorer but not in Firefox. How to I fix this? I don't want to bind the keydown explicitly to th checkbox, I want to be able to use delegation. Maybe I can't?
Thx,
/Tommy
Try binding change.
$(document).bind('keydown', function(e) { alert('keydown fired'); })
.bind('change', function(e){ alert('keydown fired'); };
Although it may be better to target check boxes specifically.
$(document).bind('keydown', function(e) { alert('keydown fired'); });
$('input:checkbox').bind('change', function(e){ alert('keydown fired'); };

Categories

Resources