JavaScript 'click' not working

Question

I have a click event in a script associated with a div id - when i move the mouse in the div area and click (the mouse does not change cursor) it does not fire off the event listener how do I make a div area clickable?

<script>
  var myEl = document.getElementById('dealdata');

  myEl.addEventListener('click', function() {
    alert('Hello world');
  }, false);
</script>



<td  BGCOLOR="#91be40" align="center" valign="center">
<div id="dealdata">
<br /><?echo $dpromo;?> 
<h1><?echo $dealvalue; ?></h1>
</div> 
</td>

yikes - shouldn't have stepped away my code does have dealdata - not sure how that got copied to the stack wrong - question was updated — GregM
– GregM, Commented May 16, 2014 at 14:16

JLRishe · Accepted Answer · 2014-05-16 14:43:09Z

3

I'm going to guess that dealdata hasn't yet been created when your script runs, because it is underneath the <script> element.

Use an onload handler:

 window.onload = function() {
     var myEl = document.getElementById('dealdata');

     myEl.addEventListener('click', function() {
        alert('Hello world');
     }, false);
 };

As far as your mouse pointer not changing, it's not going to change unless you specifically tell it to. You can do this with CSS:

<style>
    #dealdata { cursor: pointer; }
</style>

edited May 16, 2014 at 14:43

answered May 16, 2014 at 14:01

JLRishe

102k19 gold badges138 silver badges171 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

GregM Over a year ago

yikes - shouldn't have stepped away my code does have dealdata - not sure how that got copied to the stack wrong

GregM Over a year ago

if you remove the items about #ddata - then this is the correct answer thank you! the issue was the <div> was after the script and therefore needed to be placed in the onload Thanks!

su- · Accepted Answer · 2014-05-16 14:26:14Z

3

Change

var myEl = document.getElementById('dealdata'); //your div's id is 'ddata'

to

var myEl = document.getElementById('ddata');

JSFiddle page: http://jsfiddle.net/lisp/Mr2jc/

edited May 16, 2014 at 14:26

answered May 16, 2014 at 14:01

su-

3,1763 gold badges34 silver badges44 bronze badges

2 Comments

GregM Over a year ago

yikes - shouldn't have stepped away my code does have dealdata - not sure how that got copied to the stack wrong...

su- Over a year ago

OK. Then you can either do what JLRishe suggested to wrap your script inside window.onload = funciont() {...};, or simply put <script> tag somewhere after that <div> tag. The problem in your current code is, when you call var myEl = document.getElementById('dealdata'); the <div> tag has not been created yet. Also see JSFiddle page in my edit.

Merlin Denker · Accepted Answer · 2014-05-16 14:01:26Z

1

Your divs id is ddata but youre checking for dealdata in your javascript...

answered May 16, 2014 at 14:01

Merlin Denker

1,41811 silver badges15 bronze badges

1 Comment

GregM Over a year ago

yikes - shouldn't have stepped away my code does have dealdata - not sure how that got copied to the stack wrong

Collectives™ on Stack Overflow

JavaScript 'click' not working

3 Answers 3

2 Comments

2 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related