首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >如何在文档就绪后将新添加的HTML绑定到Colorbox

如何在文档就绪后将新添加的HTML绑定到Colorbox
EN

Stack Overflow用户
提问于 2016-08-18 00:03:41
回答 1查看 76关注 0票数 0

我在服务器端渲染一个图库(或一张图片),并获取HTML,如下所示:

代码语言:javascript
运行
复制
<ul class='cs-style-3' >
  <li>
    <figure>
      <img height='100px' class='gallery' src='someurl'>
      <figcaption>
        <div imgtitle='sometitle' class='cgallery' href='someurl'></div>
      </figcaption>
    </figure>
  </li>
</ul>

jQuery:

代码语言:javascript
运行
复制
$(document).ready(function ($) {

  $(".cgallery").colorbox({ rel: 'gallery', title: function () { return $(this).attr('imgtitle'); } });

})

HTML是通过ajax调用接收的,并被附加到页面:

代码语言:javascript
运行
复制
$(".ExpGallery").html(data.ExpGalleryHTML)

问题是超文本标记语言是在document.ready之后接收的,点击

代码语言:javascript
运行
复制
<div imgtitle='sometitle' class='cgallery' href='someurl'></div>

Colorbox根本不起作用。当这个HTML在文档准备就绪之前放在页面上时,一切都很好,所以代码也没问题。

如何让colorbox在文档就绪后添加相关的HTML时工作?

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2016-08-18 00:08:27

重新启动colorbox,一旦html被渲染。基本上是在ajax回调函数内部。

代码语言:javascript
运行
复制
$.ajax({
  ....,
  success:function(){
       ....
       $(".ExpGallery").html(data.ExpGalleryHTML)
       $(".cgallery").colorbox({ 
          rel: 'gallery', 
          title: function () { 
                 return $(this).attr('imgtitle'); 
          } 
       });
    }
});
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/39001401

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档