javascript - 在 colorbox 中加载 html 标签 div

Question

我想在 colorbox 中显示模板“.ajax”。如果我在 html 页面中定义模板并在 colorbox 中调用它的工作。当我尝试在 jquery 中创建模板并在 colorbox 中调用它时它不起作用。 工作于Fiddle 不工作 fiddle2 (想要作为在 javascript 中调用的模板)

html

<div class="ajax"><img src="https://www.w3schools.com/html/pic_mountain.jpg"/>
<p>Hello, world!</p>

jquery

$(document).ready(function(){
$.colorbox({inline:true, href:".ajax", onClosed: function() {
$('.ajax').hide()

}});
});

Answer 1

将您的 html 模板放在单独的文件中...或者您可以直接调用它

// Called directly, without assignment to an element:
$.colorbox({href:"thankyou.html"});

// Called directly with HTML
$.colorbox({html:"<h1>Welcome</h1>"});

所以对你来说会是这样的

$(document).ready(function(){
$.colorbox({inline:true, href:"template.html", onClosed: function() {
$('.ajax').hide()

}});
});

根据colorbox的官方文档。