JQuery提示框在ajax加载后无法工作。

Question

我网站上有这段代码：

$(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 Tabs和jQuery tooltips，但是在加载外部文件后，工具提示不起作用。我知道我必须使用.on()函数，但我不知道该怎么做:(

非常感谢您的建议。

- Harrison

Answer 1

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

 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." );
      });
    }
  });
});

- Marcos Pérez Gude

---

我之前尝试过了，但还是不行。非常感谢您的时间，我会继续努力让它工作 :) - Harrison

如果您能在jsfiddle.net上重现此问题，我可以更好地帮助您。也许您的控制台会抛出错误。 - Marcos Pérez Gude

是的，控制台会抛出“ui.jqXHR未定义”的错误。带有“ui.jqXHR.success(function() {”的那一行。 - Harrison

我们需要 jBox 插件的事件。我会去搜索它。 - Marcos Pérez Gude

提示框类元素位于HTML的27、31、43和47行外部文件中，具有URL。我不知道如何在jsfiddle中模拟它。URL是正确的，但是fiddle无法加载它们。 - Harrison