CODEWITHSUNDEEP
javascripthtmlcss
GregM
GregM

Reputation: 3734

JavaScript 'click' not working

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>

Upvotes: 0

Views: 1280

Answers (3)

JLRishe
JLRishe

Reputation: 101662

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>

Upvotes: 3

su-
su-

Reputation: 3166

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/

Upvotes: 3

Merlin Denker
Merlin Denker

Reputation: 1418

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

Upvotes: 1

Related Questions