当工具提示显示

我加入一个title到div用简单的线条无法删除标题元素：当工具提示显示

j$("#div").attr("title", "My title.");

的div里面是一个选择框。当您在选择框中选择某些内容时，它会调用代码以删除div的title。（这是使用.change功能，如果它很重要。）

j$("#div").removeAttr("title");

此代码的伟大工程，如果没有显示当前标题提示。但是，如果显示标题工具提示，则jQuery无法从div中删除title。由于选择器位于div之内，因此将鼠标悬停在选择器上会显示title。向下并选择选择器中的项目可保持工具提示全部显示。即使我强制关闭工具提示，但removeAttr代码仍然无法删除title，因为代码执行速度比工具提示的淡出速度快。

我要么需要一种方法来成功地停止动画（我试过在停止使用变体，并且可能永远不会真正获得正确的工具提示来运行停止），这是一种延迟移除代码的方法直到淡出完成为止的标题（我试过settimeout，这是行不通的），或者强制删除标题即使提示仍处于打开状态。

来源

2014-01-15 user3199619

您的意思是[.stop（）]（http://api.jquery.com/stop/）或[.finish（）]（http://api.jquery.com/finish/）？ – Blazemonger

我特别试过.stop（）。我没有尝试.finish（）。 – user3199619

你还没有说过你是如何创建工具提示的，这很重要。

如果您正在使用jQueryUI的的工具提示功能（如果没有，为什么不呢？），那么你必须使用tooltip('destroy')解除绑定工具提示，即：

jsFiddle Working Demo

HTML：

<div id="div"> 
    <select id="divSel"> 
     <option value="0">Choose One:</option> 
     <option value="1">One</option> 
     <option value="2">Two</option> 
    </select> 
</div> 
<input type="button" id="mybutt" value="Add Title" />

jQuery/javascript：

$(document).tooltip(); 

$('#divSel').change(function() { 
    $(document).tooltip("destroy"); 
    $("#div").removeAttr("title"); 
}); 

$('#mybutt').click(function() { 
    $("#div").attr("title", "This is a title added to display a tooltip."); 
    $(this).hide(); 
});

CSS：

#div {width:20%;height:80px;background:wheat;margin-bottom:10px;} 
#divSel{margin-top:30px;margin-left:30px;}

来源

2014-01-15 20:04:36 gibberish

我没有使用jQueryUI的tooltis功能，因为它们不是真的需要。我需要的只是在特定条件下在div上添加标题，并在其他条件下将其删除。就这样。我确实尝试过使用你建议的方法。如果显示工具提示，它仍然不会删除标题属性。 – user3199619

好的，那么别的事情正在发生。查看[this revised jsFiddle]（http://jsfiddle.net/nXRe5/2/） - 所有jQueryUI工具提示代码已被删除。请注意，当'select'被改变时'title' attr就会被移除。（*在Chrome中使用Chrome开发工具 - F12 - 实时观看标题添加到DIV，然后在选择更改时移除*） – gibberish

已编辑。是的，修改过的小提琴现在可以工作了。有趣。所以即使我没有明确使用jQueryUI代码，它仍然可能是原因。我知道图书馆在那里。我必须解决这个问题。谢谢。对此，我真的非常感激。 – user3199619

你可以使用fadeOut（）或类似的东西。函数回调在淡出完成时执行。

$("#div").click(function() { 
    $("#div").fadeOut("slow", function() { 
    // Animation complete. 
    }); 
});

来源

2014-01-15 19:30:06 BenDavidJamin

我不是动态显示/隐藏div的弹出窗口。你在那里会隐藏我的选择器所在的div。如果我知道如何找到发生在div上的实际弹出式工具提示，它将工作得很好。 – user3199619

没有它，很难说什么可能是错误的任何代码，但我无法重现这个问题。

见this fiddle：

HTML

<div id="div" title="My title."> 
<div>#div</div> 
<select id="sel"> 
    <option value="0">Add tooltip</option> 
    <option value="1">Remove tooltip</option> 
    <option value="">Do Nothing</option> 
</select> 
</div> 
<div>Log:</div> 
<div id="logger"></div>

的jQuery/JavaScript的

var $log = $('#logger'); 
function log(text){ 
    $log.append($('<div></div>').html(text)); 
} 
$('#sel').change(function(){ 
    switch(parseInt($(this).val())){ 
     case 0: 
      $('#div').attr("title", "My title."); 
      log('Added tooltip'); 
      break; 
     case 1: 
      $('#div').removeAttr("title"); 
      log('Removed tooltip'); 
      break; 
     default: 
      log('Nothing happened'); 
    } 
});

CSS

#div{height:200px;width:200px;background:#FFFFF0;border:1px solid red;}

来源

2014-01-15 20:21:11 Jeremy

当工具提示显示

回答

相关问题