javascript 当用户按 Esc 时停止关闭花式框
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14158282/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Stop fancybox closing when user presses Esc
提问by Jake Neal
I am using fancybox on a page, but I'm using it as more of a design feature than a jQuery modal. I am trying to stop the user from being able to close it (as it will "break" the design of the page). I have managed to stop the user from clicking off fancybox, but I am having trouble stopping it close when the Esc key is pressed. I have tried 'closeOnEscape': falsebut this doesn't seem to work. Below is my code. Any suggestions as to what I am doing wrong or what I need to do?
我在页面上使用fancybox，但我更多地将它用作设计功能而不是jQuery 模式。我试图阻止用户关闭它（因为它会“破坏”页面的设计）。我已经设法阻止用户点击fancybox，但是当按下 Esc 键时我无法阻止它关闭。我试过了，'closeOnEscape': false但这似乎不起作用。下面是我的代码。关于我做错了什么或我需要做什么的任何建议？
$(document).ready(function () {
$.fancybox({
'width': '340px',
'height': '100%',
'autoScale': true,
'transitionIn': 'none',
'transitionOut': 'none',
'type': 'iframe',
'href': 'form.php',
'hideOnContentClick': false,
'closeBtn' : false,
'helpers' : {
'overlay' : {
'closeClick': false,
}
}
});
});
回答by moonwave99
Check the keysoption from fancyBox docs:
检查fancyBox 文档中的keys选项：
keys
Define keyboard keys for gallery navigation, closing and slideshow
Object; Default value:
键
定义用于画廊导航、关闭和幻灯片
对象的键盘键；默认值：
{
next : {
13 : 'left', // enter
34 : 'up', // page down
39 : 'left', // right arrow
40 : 'up' // down arrow
},
prev : {
8 : 'right', // backspace
33 : 'down', // page up
37 : 'right', // left arrow
38 : 'down' // up arrow
},
close : [27], // escape key
play : [32], // space - start/stop slideshow
toggle : [70] // letter "f" - toggle fullscreen
}
Just map the closevalue to null.
只需将close值映射到null.
If you are using fancyBox2, add this property to your code:
如果您使用的是fancyBox2，请将此属性添加到您的代码中：
$.fancybox({
// all your other options here
...,
keys : {
close : null
}
}
回答by Stuart Burrows
@moonwave99 has the correct answer for fancybox2. If you are using v1.3+ then you must use:
@moonwave99 为fancybox2 提供了正确答案。如果您使用的是 v1.3+，则必须使用：
enableEscapeButton: false
回答by Lindsey D
As others have mentioned in comments, modal: trueworks perfectly...
正如其他人在评论中提到的那样，modal: true工作完美......
$.fancybox({
modal: true
});
From the docs...
modal- If set to true, will disable navigation and closing.
modal- 如果设置为 true，将禁用导航和关闭。
