CODEWITHSUNDEEP
jqueryeventstriggers
Matteo Bononi 'peorthyr'
Matteo Bononi 'peorthyr'

Reputation: 2220

Intercept a click, make some actions and then propagate "click" again

Good day all.

today it had been asked to me to develop a javascript (jquery) tracking for some events on thousands of web pages.

I have to intercepts some clicks on clickable elements, do some calls, and then let the page continue work as always. For example, let's say that on the page there is some text inputs, a couple of checkboxes, some links and a submit button.

lets ignore the submit button for a while. i'll handle it later. i have think something like this:

$( document ).ready(function() {
    $('input[type=button], input[type=submit], input[type=checkbox], button, a').bind('click', function(evt, check) {
        //evt.preventDefault();

        console.log("id:"+ evt.target.id+", class:"+evt.target.class+", name:"+evt.target.name);
        console.log (check);

        evt.target.trigger('click', 'check');
    });
});

I had to use jquery 1.5, and can't update to nothing more.

I guessed that this could be staight forward, but the code above returns this error:

id:terms, class:undefined, name:terms 
undefined //this is ok, the check variable will be used to distinguish real clicks from triggered ones.

Uncaught TypeError: 
Object #<HTMLInputElement> has no method 'trigger' 
(anonymous function) 
E jquery-1.5.min.js
d.event.handle jquery-1.5.min.js
j.handle.l jquery-1.5.min.js

am I forgot something...? thanks in advance.

Upvotes: 1

Views: 1005

Answers (3)

MonkeyZeus
MonkeyZeus

Reputation: 20737

Definitely upgrade jQuery if you can.

I think the mousedown listener might be suitable for you:

jQuery latest 1.x branch

$('button, input[type="checkbox"]').on('mousedown', function(e){
    alert(e.type);
});

/* uncomment this and comment the top to see the difference
$('button, input[type="checkbox"]').on('mouseup', function(e){
    alert(+e.type);
});
*/

HTML

<button>Click Me</button>
<br>
<input type="checkbox">

JSfiddle

You are not able to use mouseup at the same time because it fires off when you go to click the alert box in this example.

I think you should have no problem implementing an ASYNC AJAX call upon mousedown and then have mouseup trigger another one if you want. I guess this would be useful if you wanted to calculate how many milliseconds your users hold their mouse for before releasing.

Upvotes: 1

rt2800
rt2800

Reputation: 3045

wrap evt.target into jQuery object like $(evt.target).trigger(...)

Upvotes: 0

Ohgodwhy
Ohgodwhy

Reputation: 50787

$(evt.target).trigger

evt.target by its self does not have a jQuery wrapper.

This is evident by the following line:

Object #<HTMLInputElement> has no method 'trigger'

Which states you have an HTMLInputElement as an object as opposed to a jQuery object.

Furthermore, upgrade your version of jQuery. 1.5 is extremely dated, you're missing performance and key functions.

Upvotes: 2

Related Questions