Questions tagged [jquery-on]

jquery on method can be used to bind events on dom elements. It also supports event delegation.

jQuery .on() attach an event handler function for one or more events to the selected elements. docs

$("selector").on( events [, selector ] [, data ], handler )

The .on() method attaches event handlers to the currently selected set of elements in the jQuery object. As of jQuery 1.7, the .on() method provides all functionality required for attaching event handlers.

Examples

// Example 1
$("div").on("click", function(){
  // do something
});
// Example 2
function notify() {
  // do something
}
$("button").on("click", notify);
// Example 3
$("input").on("keyup keydown", function(){
  // do something
});

Resource

166 questions
2
votes
7 answers

jQuery taking the first PHP result

I'm trying to select the data that comes from the data base with jQuery, but my problem is that only the first result has a click handler bound to it. Here is the PHP part:
Klaus
  • 39
  • 5
2
votes
4 answers

using the .each() function doesn't allow me to use the .on() function

I would like to get some guidance on the use of .each() and .on(). I am trying to remove the class playing from the element that contains them after they have ended their transition. However, on entering the code below, the console spews this out…
Calvin Yee
  • 32
  • 1
  • 5
2
votes
2 answers

How to use NOT selector for selector of .on() using jquery?

I'm currently using this to select fields: $('body').on('change', '#mainFrom input', function(){ How do I apply a not selector for class listName ? I've tried : $('body').not('.listName').on('change', '#mainForm input', function(){ Which didn't…
Tom
  • 1,436
  • 24
  • 50
2
votes
1 answer

using .off function for multiple event handlers on a single selector

I have a code in which I have attached multiple event-handlers to a single selector using .on function of jquery $(document).on({ mouseenter: function() { console.log("handle enter"); }, mouseleave: function() { …
Rakhi
  • 135
  • 9
2
votes
2 answers

jquery .on() pass data through function

I am reading the .on() jquery documentation. And is it possible to pass some data like this: function greet( event ) { alert( "Hello " + event.data.name ); } $( "button" ).on( "click", {name: "Karl"}, greet ); The prototype of the methos…
user3046608
  • 21
  • 1
  • 2
2
votes
2 answers

jQuery append and binding click event using on

I am attempting to create a table row with a button in it that when clicked creates a new table row. The new row also has the same "add line" button on it and I would like to be able to click that button to add another row. But I cannot seem to…
MatthewLee
  • 609
  • 1
  • 10
  • 20
2
votes
2 answers

How to call a function in every element in the DOM even if they are dynamically created

I want to call a function over specific elements on my DOM, for example: $(".red").css({backgroundColor: "pink"}); It works ok for any element already existing into the DOM, but I also want to this method to be called in elements dynamically added…
fguillen
  • 36,125
  • 23
  • 149
  • 210
2
votes
1 answer

Proper way to set off() in jquery hammer events

I'm wondering what is the best way for setting up my hammer.js configuration on a simple document which I'm working on. Here's my code: var tappableArea = $('.content'); var touchableArea = $('.sidebar'); function reloadHammerGestures() { …
user1854236
  • 446
  • 1
  • 5
  • 16
2
votes
3 answers

Bind multiple events to same function

How can I bind mutiple events to the same function. I want click and touchstart to do the same. And then I want a second function for mouseover. I would like to use this kind of setup: $(document).on({ click: function (event) { …
Robert Bue
  • 1,774
  • 2
  • 11
  • 14
2
votes
2 answers

Is there an equivalent to jQuery.on for Firefox addons?

Is there anything equivalent to jQuery's .on functionality, for chrome-level javascript? I want a Firefox addon to add events on a large number of elements in a document in chrome context. Looping and adding eventlisteners sounds slow and wouldn't…
NoBugs
  • 9,310
  • 13
  • 80
  • 146
2
votes
3 answers

jQuery: use .on() instead of .live() to attach event handler to $('selector') object

I understand that .live() has been removed from jQuery 1.9 and that .on() should be used instead. So far .on() has worked perfectly for me if the selector is a string. For example, $("a.offsite").live("click", function(){ alert("Goodbye!");…
shengloong
  • 85
  • 1
  • 5
  • 8
2
votes
2 answers

Why does jquery's on() only work once?

I have a simple script that works only once. My script will check a checkbox if I click anywhere inside a table row. However, if I click inside the row a second, third, etc. time, then it doesn't work anymore. Why? I am now using jquery 1.9.1. My…
Nancy Collier
  • 1,469
  • 4
  • 17
  • 21
2
votes
2 answers

Is there a way to unbind a delegated event on each element instance?

What I need to do is get the functionality of jQuery.one on each matched element using delegation. As you can see clicking on the link for "Baz" or "Bat" appends "(removed)" multiple times. On the other hand clicking the link for "Foo" executes the…
prodigitalson
  • 60,050
  • 10
  • 100
  • 114
2
votes
1 answer

jQuery on() or live

I'm trying to use the code below. It works fine on Firefox as expected but when I try IE or Chrome, the on or live methods don't fire. Can anybody help me about it? $('#serverCpus').find('option').on('mouseenter', function (a) { …
Just Ersoy
  • 151
  • 1
  • 10
2
votes
3 answers

.live() jQuery - how to change my events

How do i change these events to .live() event handler? I thought I could just change $(document).ready(function() ...to.... $(document).live(function() as well as .keydown and .data to .live but i can't seem to get it to work... help…
Head
  • 548
  • 7
  • 26
1 2
3
11 12