if-else条件不适用于Javascript

这里的场景是，我已经创建了工具提示，对于所有的

div

标记，我已经给出了不同的id，它应该根据它们的id生成不同的工具提示。。为此，我在javascript下使用了

if-else

条件，并检查了

div

的id，但这里的代码不在else-if条件中：您可以在上查看实时示例。。伙计们，请帮我一个忙，并提前感谢……）

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....

if（event.target.id==“ips”）
{
$（“位于或影响同一侧”）
.附于（“主体”）；
}
else if（event.target.id==“tyu”）
{
$（'hi i m tooltip'）。附加到（'body'）；
}否则。。。。

你做错了：

if(document.getElementById("ips"))

这总是正确的，因为总是有一个id为

ips

的元素。您需要将其与实际id进行比较：

var this_id = $(this).attr("id");
if(id === "ips")

使用

而不是

document.getElementById

试试这个：

var linkId=$（this.attr（'id'）；
交换机（linkId）{
案例“ips”：
$（“位于或影响同一侧”）。附加到（“主体”）；
打破
案件“tyu”：
$（'hi i m tooltip'）。附加到（'body'）；
打破
违约：
$（“嗨，我是最后一个工具提示”）.appendTo（'body'）；
打破
}

$(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
    });

});

$（文档）.ready（函数（）{
var changeTooltipPosition=函数（事件）{
var tooltipX=event.pageX-8；
var tooltipY=event.pageY+8；
$（'div.tooltip'）.css（{top:tooltipY，left:tooltipX}）；
};
var showTooltip=函数（事件）{
console.log（event.target）；
$（'div.tooltip'）.remove（）；
if（event.target==document.getElementById（'ips'））
{
$（“位于或影响同一侧”）。附加到（“主体”）；
}else if（event.target==document.getElementById（'tyu'））{
$（'hi i m tooltip'）。附加到（'body'）；
}否则{
$（“嗨，我是最后一个工具提示”）.appendTo（'body'）；
}
更改工具位置（事件）；
};
var hideTooltip=函数（）{
$（'div.tooltip'）.remove（）；
};
$（'div#ips，div#tyu'）。绑定({
鼠标移动：changeTooltipPosition，
鼠标指针：显示工具提示，
鼠疫
});
});

向我们显示代码，以便我们可以帮助您

    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;
    }

$(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
    });

});