0

这里的场景是,我已经创建了工具提示,并且对于div我给出了不同 id 的所有标签,根据它们的 id,它应该生成不同的工具提示.. 为此我if else在 javascript 下使用条件并检查divid,但是在这里否则代码不会出现在其他情况下:您可以查看此链接上的实时示例..请大家帮帮我,并在此先感谢.. :)

4

5 回答 5

0

document.getElementById("ips")始终返回 Html div 对象,其布尔值将为 true。比较值。

您需要从事件中获取目标的属性“id”并将其与您的 div id 进行比较。

 if(event.target.id=="ips")
  {

  $('<div class="tooltip">situated on or affecting the same side</div>')
        .appendTo('body');
  }
  else if(event.target.id=="tyu")
  {

  $('<div class="tooltip">hi i m tooltip</div>').appendTo('body');
  }else....
于 2013-09-11T09:51:06.077 回答
0

你这样做是不对的:

if(document.getElementById("ips"))

这将永远是正确的,因为总是有一个 id 的元素ips。您想要的是将其与实际 id 进行比较:

var this_id = $(this).attr("id");
if(id === "ips")
于 2013-09-11T09:52:22.053 回答
0

利用

     if (event.target.id == "ips") {/*Code*/} 
     else if (event.target.id == "tyu") {/*Code*/} 
     else {/*Code*/}

代替document.getElementById

演示

于 2013-09-11T09:53:18.103 回答
0

试试这个:http: //jsfiddle.net/6CBMw/8/

    var linkId = $(this).attr('id');
    switch(linkId){
        case 'ips':
            $('<div class="tooltip">situated on or affecting the same side</div>').appendTo('body');
            break;
        case 'tyu':
             $('<div class="tooltip">hi i m tooltip</div>').appendTo('body');
            break;
        default:
             $('<div class="tooltip">hi i m LAST LAST tooltip</div>').appendTo('body');
            break;
    }
于 2013-09-11T09:55:29.873 回答
0

http://jsfiddle.net/6CBMw/13/

$(document).ready(function() {

    var changeTooltipPosition = function(event) {
      var tooltipX = event.pageX - 8;
      var tooltipY = event.pageY + 8;
      $('div.tooltip').css({top: tooltipY, left: tooltipX});
    };

    var showTooltip = function(event) {
      console.log(event.target);  
      $('div.tooltip').remove();
      if(event.target == document.getElementById('ips'))
      {
          $('<div class="tooltip">situated on or affecting the same side</div>').appendTo('body');
      } else if(event.target == document.getElementById('tyu')){
          $('<div class="tooltip">hi i m tooltip</div>').appendTo('body');
      } else {
          $('<div class="tooltip">hi i m LAST LAST tooltip</div>').appendTo('body');
      }
      changeTooltipPosition(event);
    };

    var hideTooltip = function() {
       $('div.tooltip').remove();
    };

    $('div#ips, div#tyu').bind({
       mousemove : changeTooltipPosition,
       mouseenter : showTooltip,
       mouseleave: hideTooltip
    });

});
于 2013-09-11T10:00:20.393 回答