Javascript帮助禁用列链接和工具提示

Question

How do I disable javascript click and tooltip.

You can see the problem here http://www.vinderhimlen.dk/vind-rejse-deltag-i-konkurrencer-om-rejser

The rating column should not show a tooltip or be a link.

It is attached on my tabels row:

<tr class="thumbnail-item" onclick="window.open('<%= vind.tracking %>')" onmouseout="this.style.background='white';" onmouseover="this.style.background='#99ff33';this.style.cursor='pointer'">

My tooltip script:

  <script type="text/javascript">


  $(document).ready(function () {

 $('.thumbnail-item').mouseenter(function(e) {

  x = e.pageX;
  y = e.pageY;

  $(this).css('z-index','15')
  $(this).css('cursor', 'default')
  $(this).find(".tiptip").css({'top': y,'left': x,'display':'block'});


 }).mousemove(function(e) {

  x = e.pageX;
  y = e.pageY;

  $(this).find(".tiptip").css({'top': y,'left': x});

 }).mouseleave(function() {

  $(this).css('z-index','1')
  $(this).css('background', 'none')
  $(this).css('color', '#000000')
  $(this).find(".tiptip").animate({"opacity": "hide"},100);
 });

});
  </script>

Answer 1

Pretty easy actually. Why don't you just handle the onmouseover/out events in the <td></td> tags and leave it out on the rating column?

TR background coloring can be achieved by attaching a pseudo-class to the tr tag or the .thumbnail-item class.

tr:hover 
{
    background-color: #99FF33;
}

Answer 2

you should disable the mouseover event to bubble up.

I have run the following script using firebug to achieve the result.

$("#tabel1 tr td:nth-child(2):gt(0)")
.mouseover(
              function(event)
              {
                event.preventDefault();
                return false;
              });

edited __ As your mouse is over the tooltip, it is not working very good. move your cursor away from tooltip a little bit.

his is where you calculating the mouse points

x = e.pageX; 
y = e.pageY;

you sould do it like this

x = e.pageX+3; 
y = e.pageY+3;

in both function of mousemove and mouseover