jQuery:级联弹出窗口
我有以下代码来显示弹出 div:
<a href="#" id="pop1" rel="div#tt1">Click to show popup</a>
<div class="popupBlock" id="tt1">My popup content ...</div>
div 最初是隐藏的,通过一些 jQuery 代码,当单击 pop1 锚点时,我将其变为可见。 这是我为此所做的plgin:
(function($) {
$.fn.pop = function(options) {
var defaults = {
show: "click",
tooltip: null
};
var options = $.extend(defaults, options);
var target = $(this);
var popup = $(target.attr("rel"));
popup.css("visibility", "hidden").css("display", "none");
target.click(function() {
popup.css("visibility", "visible").css("display", "block");
return false;
});
$('body').click(function() {
popup.css("visibility", "hidden").css("display", "none");
return false;
});
popup.click(function(event) {
event.stopPropagation();
});
};
一切似乎都按顺序进行,但是当我在div中添加控件时,整个事情就中断了,例如:
<div class="popupBlock" id="tt1">My popup content ...
<span> some text here</span>
</div>
span不会触发div的单击事件并隐藏div,这是我不想要的。 有人知道我需要在这里做什么来防止这种情况发生吗? 谢谢你, V
I have the following code to display a pop-up div:
<a href="#" id="pop1" rel="div#tt1">Click to show popup</a>
<div class="popupBlock" id="tt1">My popup content ...</div>
The div is initially hidden and with a bit of jQuery code I'm turning it visible when pop1 anchor is clicked. This is the plgin I've made for this:
(function($) {
$.fn.pop = function(options) {
var defaults = {
show: "click",
tooltip: null
};
var options = $.extend(defaults, options);
var target = $(this);
var popup = $(target.attr("rel"));
popup.css("visibility", "hidden").css("display", "none");
target.click(function() {
popup.css("visibility", "visible").css("display", "block");
return false;
});
$('body').click(function() {
popup.css("visibility", "hidden").css("display", "none");
return false;
});
popup.click(function(event) {
event.stopPropagation();
});
};
All seems to be in order, but the whole thing breaks when I add a control in the div, such as:
<div class="popupBlock" id="tt1">My popup content ...
<span> some text here</span>
</div>
The span doesn't trigger the div's click event and hides the div, which I don't want.
Anyone has any idea what I need to be doing here to prevent this?
Thank you,
V
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
或者
or