當工具提示顯示

我加入一個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

當工具提示顯示

回答

相關問題