2

タイトル属性文字列を使用するツールチップ用の次の JQuery コードがあります。私の問題は、ブラウザーのツールチップも表示され、これを回避する方法がわからないことです。

function Tooltip() {
   Form.append('<div class="Tooltip"></div>');
   $('input, textarea, select, p, label').mousemove(function(e) {
      var HoverText = $(this).attr('title');
      var Tooltip = $('.Tooltip');
      if(HoverText){
         Tooltip.html(HoverText).fadeIn(100);
         Tooltip.css('left', e.clientX + 15).css('top', e.clientY + 15);
      }
   }).mouseout(function() {
       var Tooltip = $('.Tooltip');
       Tooltip.fadeOut(100);
   });
}

ありがとうございました！

アップデート：

title 属性が削除され、値は $.data に保存されます。残念ながら、mousemove 機能はこのようには機能しません...

function Tooltip() {
   Form.append('<div class="Tooltip"></div>');
   $('input, textarea, select, p, label').mousemove(function(e) {
      $(this).data('title', $(this).attr('title')).removeAttr('title');
      var HoverText = $(this).data('title');
      var Tooltip = $('.Tooltip');
      if(HoverText){
         Tooltip.html(HoverText).fadeIn(100);
         Tooltip.css('left', e.clientX + 15).css('top', e.clientY + 15);
      }
   }).mouseout(function() {
       var Tooltip = $('.Tooltip');
       Tooltip.fadeOut(100);
       $(this).attr('title', $(this).data('title'));
   });
}
4

1 に答える 1

2 
var title = $(this).data('title');
var titleAttr = $(this).attr('title');
if( titleAttr && !title){
    title = $(this).data('title', $(this).attr('title')).removeAttr('title');
}
于 2012-01-18T23:01:28.473 に答える