通过单击任意位置关闭 JavaScript 弹出窗口
Close javascript popup by clicking anywhere
我是超级新手,需要快速建议。我已经在我的wordpress网站上安装了一个基于javascript的弹出插件,当有人访问该网站时,女巫会自动打开。要关闭弹出窗口,用户必须单击弹出窗口角落中的十字 X。
我需要编辑插件,以便用户可以单击任何地方,插件将关闭。
这是我找到的javascript代码。 关于这个有什么提示吗?
function open_lightbox(){
//var closebut = (typeof(ujiPopups) !== 'undefined' && ujiPopups != null && ujiPopups.showclose && ujiPopups.showclose == "true") ? true : false;
jQuery("#popup").modal({
onOpen: function (dialog) {
dialog.overlay.fadeIn('fast');
dialog.data.hide();
dialog.container.show('fast', function () {
dialog.data.fadeIn('slow');
});
},
autoResize: false,
autoPosition: true,
escClose: false,
zIndex: 999999,
overlayClose: false
});
}
function popups_close(){
jQuery.modal.close();
jQuery("#popup").remove();
}
像这样的事情应该可以做到:
$(document).click(function() {
if($('#popup').is(':visible')) {
popups_close();
}
});
如果您希望在与弹出窗口本身交互时保持模式处于活动状态:
$(document).click(function(e) {
if (!$(e.target).is("#popup")) {
if ($('#popup').is(':visible')) {
popups_close();
}
}
});
这里有一个简单的例子:http://jsfiddle.net/wnT4G/
*通过@ComFreek查看评论以获取一些优雅的修订
我使用了一种相当奇怪的方法,但它有效:
$('.click-btn').click(function(){
$('.modal').show(); //show popup
})
$('body').click(function(){
$('.modal').hide(); //hide modal
})
$('.click-btn, .modal').click(function(e){
e.stopPropagation; // don't close modal by clicking inside modal and by clicking btn
})
用户事件
function addEvent(action) {
$("body").click(function() { action();});
}
function clearEvent() {
$("body").off('click');
}
你想要这样做:
$(document).click(function()
{
popups_close();
})
$('Your selector of the popup').click(function(e)
{
e.stopPropagation();
})
.stopPropagation();
实际上会取消通过单击文档触发的.click()
功能。因此,每当您单击文档中的任意内容时,弹出窗口都会关闭,除非单击弹出窗口本身。
希望这有帮助!
js小提琴
我认为您只想将overlayClose
并且可能escClose
设置为 true。 您的插件可能会在页面上创建一个叠加层,因此用户无法单击其他任何地方,所以我猜overlayClose: true
单击叠加层时会让插件关闭对话框。
escClose: true,
overlayClose: true
我不确定你使用的是什么插件,但这个插件使用 clickClose
属性。
相关文章:
- Javascript窗口.打开令人困惑的参数
- javascript窗口打开并添加参数
- JavaScript窗口按比例调整大小
- Javascript窗口.open中的UTF8字符串将被UIWebview's应该启动LoadWithReque
- JavaScript窗口.位置不;我不在内容编辑器Web部件中工作
- Javascript窗口弹出
- Javascript窗口.open不工作
- 在新服务器上未打开JavaScript窗口
- SeleniumIDE自动化似乎打破了JavaScript窗口
- JavaScript窗口位置延迟
- 使用onclick事件关闭JavaScript窗口
- 在没有额外功能的所有现代浏览器中居中显示JavaScript窗口
- 如何在启动之前引用javascript窗口元素
- 将文本框数据传递到JavaScript窗口.location.href
- Javascript窗口/图像加载时间 - 这应该不起作用,但它确实有效
- JavaScript 窗口['func'],参数返回 undefined 而不是函数
- 传递 PHP 变量 JavaScript 窗口位置
- 媒体查询和 JavaScript 窗口调整不同的宽度
- 延迟关闭 JavaScript 窗口
- JavaScript窗口重定向不会启动