单击模态iframe关闭对话框?
问题描述:
我正在创建一个模态对话框。首先,我将一个iframe附加到body
标签上以充当我的覆盖层。单击模态iframe关闭对话框?
<div class="modal-screen">
<iframe src="javascript:false;"></iframe>
</div>
然后我将我的对话框追加到body
。
<div class="dialog">
<!-- various dialog related elements
</div>
现在我想在用户单击覆盖图时关闭对话框。问题是,我似乎无法绑定到与覆盖有关的任何事件。
要总结一下我的JS,基本上我的对话视图有一个initialize
方法,其中准备覆盖:
initialize: function() {
this.modal = $('<div class="modal-screen"><iframe src="javascript:false;"></iframe></div>')
this.modal.on('click', function(e) {
// this event never seems to fire
console.log("hello");
}
}
然后我渲染到页面时,我需要它。当我点击叠加,我从来没有看到hello
..
render: function() {
$('body').append(this.modal);
// append other dialog content
this
}
答
this.modal不是一个单一的元素,取而代之的则是一个DOM对象这就是为什么你不能绑定就可以了什么。尝试绑定$('。modal-screen',this.modal)。
+0
绑定到'this.modal.find('。modal-screen')'应该和你说的一样,对吗?我似乎无法在“this.modal”中找到除“iframe”之外的任何内容。记录'this.modal.find('*')'给了我iframe元素。我似乎无法将一个事件绑定到它,我似乎无法抓住它中的任何元素。 – 2012-04-13 13:27:07
我已阅读[使用渐进式增强设计](http://filamentgroup.com/dwpe/),最好使用iframe。然而,你建议的解决方案似乎工作得很好,所以我会继续努力,直到我有一个更好的理由不去做。 – 2012-04-17 01:56:13