CODEWITHSUNDEEP
jqueryonclick
AlxVallejo
AlxVallejo

Reputation: 3219

How to verify onclick jQuery div handler

I'm trying to add a javascript onclick event to an expandable jQuery list tag.

http://screencast.com/t/bbu2fQnqP0rs

My jQuery looks like:

jQuery('ul.childpages li.expandable div.expandable-hitarea').click(function() {
    piwiTracker.trackPageView('TreeClick');
    alert("Handler for .click() called.");
});

How can I verify whether a click on the hitarea div (heavily nested) will trigger the function?

Edit : I added the alert handler above but I'm not getting an alert when I select the div.

By the way, the Piwik documentation to track JS events:

<a href="#" onclick="javascript:piwikTracker.trackPageView('Menu/Freedom');">Freedom page</a>

Upvotes: 0

Views: 393

Answers (1)

Wouter Konecny
Wouter Konecny

Reputation: 3540

The following will do the trick:

$('ul.childpages li.expandable div.expandable-hitarea').click(function() {
    console.log("Clicked it!");
    piwiTracker.trackPageView('TreeClick');
});

You can then right-click in your browser (if you have Firefox, Google Chrome or Safari) and choose Inspect Element. Then choose the "Console" or "Log" option.

IMPORTANT: When you do not see any logging you should check your element path (the "ul.childpages ..." string). You can also check any errors in this log which might break your code.

At last, you can debug it by giving your element a unique ID and only call it with that ID like:

$('#uniqueId').click(function() {
   console.log("Clicked it!");
   piwiTracker.trackPageView('TreeClick');
});

Upvotes: 1

Related Questions