如何使用Meteor中的custombox.js插件打开模型弹出窗口? 它在我的非Meteor页面上运行良好,现在我似乎无法呈现它。
我认为问题是custombox使用了jquery的.fn原型,因为我得到了一个未定义的函数错误。我尝试使用它,因为它应用于布局的子模板(feedsItem,而feedItem又是feed的子模板)。
该代码旨在打开一个模式弹出窗口,其中包含有关新闻帖子的更多详细信息。 单击模式弹出窗口时应打开的超链接的html代码为:
<a href="#modal" class="list-group-item" id="flip">Read More</a>
并且打开的html作为模式弹出窗口(关闭onclick也将在以后发生。):
<div id="modal" style="display: none;" class="modal-example-content">
<div class="modal-example-header">
<button type="button" class="close" onclick="$.fn.custombox('close');">×</button>
<h4>Detalhe da Noticia</h4>
</div>
<div class="modal-example-body">
<p>Lorem Ipsum is simply dummy.</p>
</div>
</div>
我的模板事件代码是:
Template.feedsItem.events({
'click #flip': function(e){
var flip_position = ['vertical','horizontal'];
$.fn.custombox( this, {
effect: 'flip',
position: flip_position[Math.floor((Math.random()*2))]
});
e.preventDefault();
}
});
修改 我得到了弹出窗口,但现在打开时出现404错误。这显然是因为它没有渲染目标div(模态)。 问题是我在子模板而不是父模板(Feeds)中渲染它。