Tooltip不能與JQuery配合使用1.11.2

我試圖在移動懸停的標籤上顯示一個工具提示。我跟着這Tooltip tutorial得到了工作。本教程使用JQuery 1.4.2，我的項目建立在JQuery 1.11.2上。工具提示適用於1.4.2，但不適用於1.11.2。Tooltip不能與JQuery配合使用1.11.2

是否支持tooltip在JQuery中被刪除？我錯過了嗎？

<html> 
    <head> 
     <script type="text/javascript" src="http://code.jquery.com/jquery-1.11.2.min.js"></script> 
     <style type="text/css"> 
      #hint{ 
       cursor:pointer; 
      } 
      .tooltip{ 
       margin:8px; 
       padding:8px; 
       border:1px solid blue; 
       background-color:yellow; 
       position: absolute; 
       z-index: 2; 
      } 
     </style> 
    </head> 

    <body> 
     <h1>jQuery tooltips example</h1> 
     <label id="username">Username : </label><input type="text"/size="50"> 
     <span id="authentication-password-tooltip">Password(?)</span> 
     <script type="text/javascript"> 
      $(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) { 
        $('div.tooltip').remove(); 
        $('<div class="tooltip">I\' am tooltips! tooltips! tooltips! :)</div>') 
         .appendTo('body'); 
        changeTooltipPosition(event); 
       }; 
       var hideTooltip = function() { 
        $('div.tooltip').remove(); 
       }; 
       $("span#authentication-password-tooltip,label#username'").bind({ 
        mousemove : changeTooltipPosition, 
        mouseenter : showTooltip, 
        mouseleave: hideTooltip 
       }); 
      }); 
     </script> 
    </body> 
</html>

來源

2015-04-15 Joseph

你最後一個選擇器有一個拼寫錯誤（額外的'''），它應該是：'$（「span＃authentication-password-tooltip，label＃username」）'。如果你修復它的工作正常：http://jsfiddle.net/15sk4wks/ –

也只是FYI，每當你得到一些JS代碼不起作用，首先要做的是檢查控制檯的錯誤。 –

取出'從$("span#authentication-password-tooltip,label#username'");它正在破壞劇本。

Here's a working jsFiddle

一些普遍性的建議：如在評論中指出的，你應該總是先檢查控制檯，當你有一個JavaScript錯誤。另外，1.4.2 is very old now（超過5年）。很多變化，所以你應該嘗試在未來尋找更多的當前教程。

來源

2015-04-15 10:45:41

真的非常感謝您的反饋。非常感謝 – Joseph

很高興幫助！請記住選擇一個答案！ :) –

Tooltip不能與JQuery配合使用1.11.2

回答

相關問題