JQuery工具提示在ajax加载后不起作用

JQuery Tooltip doesn't work after ajax load

本文关键字:不起作用 加载 ajax 工具提示 JQuery      更新时间:2023-09-26

我的网站上有这样的代码:

$(document).ready(function() {
  $('.tooltip-game').jBox('Tooltip', {
    closeOnMouseleave: true,
    ajax: {
      url: 'tooltips/tooltip-game-html.jsp',
      reload: true,
      getData: 'data-ajax',
      setContent: true,
      spinner: true
    }
  });
  $( '#tabs-1' ).tabs({
    beforeLoad: function( event, ui ) {
      ui.panel.html('<div style="text-align: center; vertical-align: middle;"><img src="images/loading.gif" />');
      ui.jqXHR.fail(function() {
        ui.panel.html("Couldn't load this tab. We'll try to fix this as soon as possible." );
      });
    }
  });
});

我使用jQuery选项卡和jQuery工具提示,但在用ajax加载外部文件后,工具提示不起作用。我知道我必须使用。on()函数,但我不知道如何使用:

非常感谢你的建议。

需要在异步调用结束后初始化工具提示。

 function tooltips() {              
  $('.tooltip-game').jBox('Tooltip', {
    closeOnMouseleave: true,
    ajax: {
      url: 'tooltips/tooltip-game-html.jsp',
      reload: true,
      getData: 'data-ajax',
      setContent: true,
      spinner: true,
     //Take a look to this line
      success: function() {
            tooltips();
      }
    }
  });
 }    

  $( '#tabs-1' ).tabs({
    beforeLoad: function( event, ui ) {
      ui.panel.html('<div style="text-align: center; vertical-align: middle;"><img src="images/loading.gif" />');
      ui.jqXHR.fail(function() {
        ui.panel.html("Couldn't load this tab. We'll try to fix this as soon as possible." );
      });
    }
  });
});