Javascript 使用$ajax检索内容

我用这个来介绍我的web应用程序的各个页面的使用指南。这非常有效，但是目前指南的所有内容都是在脚本中静态设置的：

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进行更新

---

我做错了什么？

如果不起作用，内容将包含一个

XHR

对象。你。您需要在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返回，只需从

success

handler运行一些成功代码即可。