Question

我正在使用此fork of Pageguide.js来提供有关使用我的网络应用的各个页面的一些指导。这非常好用，但是目前指南的所有内容都是在脚本中静态设置的：

var guide = {
  id: 'jQuery.PageGuide',
  title: 'What can I do here?',
  steps: [
    {
      target: '#user-tools',
      content: 'Some static content here'
    }
  ]
}

$(function() {
  // Load the default guide!
  $.pageguide(guide);
});

我希望使用对服务器的$ajax调用动态检索内容，因此我将代码更改为以下添加$ajax调用：

var guide = {
  id: 'jQuery.PageGuide',
  title: 'What can I do here?',
  steps: [
    {
      target: '#user-tools',
      content: function() {
        $.ajax({
          type: 'GET',
          url: 'user-guide',
          data: {elementId: '#user-tools'},
          success: function(html) {
            return html;
          }
        });
      }
    }
  ]
}

虽然$ajax调用似乎正常（我使用Chrome调试器进行了检查，并且可以看到正确的html被返回且日志中没有出现错误），但指南未使用从中返回的html进行更新服务器。

我做错了什么？

Answer 1

这不起作用，内容将包含XHR个对象。你can't return data from an asynchronous AJAX call。在 AJAX返回后，您需要运行代码：

$.ajax({type: 'GET',url: 'user-guide', data: {elementId: '#user-tools'}}).done(function(html){ var guide = { id: 'jQuery.PageGuide', title: 'What can I do here?', steps: [{target: '#user-tools',content:html}] }; //rest of your code goes here });

使用$ ajax检索内容

1 个答案: