Jquery 成功的ajax注入后如何激活Colorbox？

我看到Colorbox可以加载外部HTML，但只能加载引用的整个页面。我只想注入一些登录和注册表单所需的页面部分，然后仅在流程成功时启动Colorbox

我已经勾勒出了以下内容

$('.gateway').click(function(e) {
  var _link = $(this);
  var $error = $('<div id="error" />');
  var $modal = $('<div id="modal" />');

  var $url = _link.attr('href') + ' #gateway'; 
    // I only want to load #gateway from the target page

  $modal.load($url, function (response, status, xhr) {
    if (status == 'success') {
      $('body').append($modal);
      $modal.hide().colorbox({
        width:'60%', 
        inline:true, 
        href:'#gateway',
        onLoad:function(){ $modal.show(); },
        onCleanup:function(){ 
          $modal.remove(); 
          $error.remove(); 
        }
      });
    }
    if (status == 'error') {
      var $msg = 'Sorry, something went wrong: ';
      $error.html($msg + xhr.status + ' ' + xhr.statusText);
      // Do something with this message!
    }
  });

  e.preventDefault();
});

$（“.gateway”）。单击（函数（e）{
var _link=$（此）；
变量$error=$（''）；
变量$modal=$（''）；
var$url=_link.attr（'href'）+'#网关'；
//我只想从目标页面加载#网关
$modal.load（$url，函数（响应，状态，xhr）{
如果（状态=‘成功’）{
$（'body'）。追加（$modal）；
$modal.hide（）.colorbox({
宽度：'60%'，
是的，
href:“#网关”，
onLoad:function（）{$modal.show（）；}，
onCleanup:function（）{
$modal.remove（）；
$error.remove（）；
}
});
}
如果（状态=‘错误’）{
var$msg='对不起，出了问题：'；
$error.html（$msg+xhr.status+''+xhr.statusText）；
//对这个消息做点什么！
}
});
e、 预防默认值（）；
});

$modal

可以使用右侧的

#gateway

内容，但Colorbox不起任何作用。我感觉我在这里弄乱了我的事件和方法。我猜Colorbox方法（这是正确的术语吗？）只响应click事件，而不响应随后的成功加载事件

---

如果有人能帮助我让Colorbox响应加载事件，或者向我展示一种更优雅的方式来实现我的目标，我将不胜感激

ColorBox使用jQuery的load方法实现ajax功能，因此您可以使用它从HTML文档中提取一个片段。请尝试以下内容，而不是您发布的所有内容：

$('.gateway').colorbox({
    width:'60%', 
    href: function(){ return $(this).attr('href') + ' #gateway';}
});

---

如果ajax请求不成功，colorbox将给出这样的消息。如果您决定需要自定义错误处理，您可以对HTML片段发出ajax/load请求，并将其直接传递到colorbox的“HTML”属性，而不是将其添加到DOM中并尝试使用内联属性。

谢谢Jack。有谁比Colorbox的制造商更喜欢听它呢！