Sorasyn   -  Apr 03, 2014

So I'm a bit of a newbie with Javascript, and have been doing a good amount of research on click events. Sadly I've yet to resolve my problem of not getting any click events to fire on my pages, not a single one. the JS doesn't even seem to be getting evaluated at any point.

Things I've tried:

  • Calling the click event on a CSS classed HTML element.
  • Calling a "live" function on a CSS classed element.

I just need to call a simple click event on one element identified by a css class type. Can anyone offer some suggestions?

Hawkee  -  Apr 04, 2014

Are you defining your click events in $(document).ready?

ProIcons  -  Apr 04, 2014

Its better to Use the jQuery Library. It has everything ready for you.
Thats the site:
Thats the Documentation:
And thats what you need:

Hawkee  -  Apr 04, 2014

I assume you're using jQuery because you mentioned the "live" function.

ProIcons  -  Apr 04, 2014

Well I didnt saw that he mentioned the live function. I didnt see in his topic mentioning jquery so i guessed we wasn't.
for the class element the proper solution with jquery is

$(".classname").click(function() { somecodehere... });
$( document ).on( "click", ".classname", function() { somecodehere... });

A non jquery approach is:

document.getElementsByClassName("classname")[0].onclick = function () { somecodehere... };

jquery .live() has been deprecated.

As of jQuery 1.7, the .live() method is deprecated. Use .on() to attach event handlers. Users of older versions of jQuery should use .delegate() in preference to .live().

Sorasyn  -  Apr 05, 2014

Sorry it's been a busy last few days.

@Hawkee : Yes, I'm defining all events inside of a "ready" event. They generally look something like this.

$(document).ready(function(e) {
      $(".ProfileBar").click(function(e) {
            alert("Profile Bar was clicked!");

I've tried using both JQuery AND vanilla JS. I'm starting to think that there's something wrong with my XAMPP local server. I used to be able to embed and execute JS code, but it seems to be ignoring it completely now.

@ProIcons : Thanks for the tips! I'll give them a try here in the next few days when I get some time and I'll come back with some results. I got tired of fighting it so for the time being I just threw together some make shift CSS code to compensate for the time being.

Hawkee  -  Apr 05, 2014

Your server shouldn't have anything to do with it. JavaScript is entirely client side. Open your browser console and do a console.log call to see if your $(document).ready is even being called.

ProIcons  -  Apr 06, 2014

SunnyD. The are 3 Different explanations why is not working.
1) You have something wrong in your code and JavaScript halts its runtime before reach to your click event. You can easily determine that using
Chrome -> Tools -> JavaScript Console ,
FireFox -> Web Developer -> Web Console
and try reloading your page. usually appears every error in red.
2) You are not including jQuery properly.
Check my Example here:
On The Result Panel try to Click the "Click Me" element that is inside a box.
In the 3 other panels you can see all the source code needed for this example.

3) If in the example when you click the element, is not happening anything (ultra super rare) , then the problem is with your browser. You might have JavaScript support closed by your browser (highly unlikely , you wouldn't even able to post here, or get on facebook and so on) or you might have NoScript Addon that it blocks from unknown sites, the javascript runtime, and you have to allow it.

Sorasyn  -  Apr 08, 2014

Sorry it's been a busy couple days. I got around to digging back into it just now and I can't find any events that fire at all. Absolutely none, "ready" included. I did have a "$ is not defined" error, but promptly fixed it with a src link to JQuery 1.7. The page isn't blocking the Javascript as far as I can tell.

@ProIcons : Your JSFiddle link works just fine for me, so it's not my browser, which I never truly believed was the problem.

EDIT: As far as I can gather from the console events log, it's loading everything and actually sees the script in the HTML code, but no ready event is ever fired after garbage collection.

Hawkee  -  Apr 08, 2014

Do you have this running somewhere online? I can take a look.

ProIcons  -  Apr 08, 2014

Send me the link aswell if you have it online

Hawkee  -  Apr 08, 2014

Where do you have your JavaScript calls? Are they in a

Sorasyn  -  Apr 08, 2014

I'm strictly building an HTML template, so I didn't really have a need to put it online. It's a part of a bigger project which has a Ruby back-end.

I've tried both an external JS sheet, and embedded code inside

EDIT: Currently I have my very short test snippet inside an "Events" JScript file. Which is then subsequently linked into the HTML template.

ProIcons  -  Apr 08, 2014

it might have an error . As i said JavaScript halts its run time when detects any error. try adding some debuging
for exampe after you include your jquery

Sorasyn  -  Apr 08, 2014

I got it working now, thanks. :) I had to import the JQuery library before importing and using my external JS file.

ProIcons  -  Apr 09, 2014

And how is it possible to not showing to you the "$ is not defined" error?

Sign in to comment

Are you sure you want to unfollow this person?
Are you sure you want to delete this?
Click "Unsubscribe" to stop receiving notices pertaining to this post.
Click "Subscribe" to resume notices pertaining to this post.