javascript 如何通过href onclick让fancybox显示“是/否确认框”?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/5642259/
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
How can i make fancybox display a "yes/no confirm box" via a href onclick?
提问by PHPNewEE
im using the following code as replacements for confirm boxes in javascript.
我使用以下代码替换 javascript 中的确认框。
function fancyAlert(msg) {
jQuery.fancybox({
'modal' : true,
'content' : "<div style=\"margin:1px;width:240px;\">"+msg+"<div style=\"text-align:right;margin-top:10px;\"><input style=\"margin:3px;padding:0px;\" type=\"button\" onclick=\"jQuery.fancybox.close();\" value=\"Ok\"></div></div>" }); }
function fancyConfirm(msg, callback) {
var ret;
jQuery.fancybox({
'modal' : true,
'content' : "<div style=\"margin:1px;width:240px;\">"+msg+"<div style=\"text-align:right;margin-top:10px;\"><input id=\"fancyConfirm_cancel\" style=\"margin:3px;padding:0px;\" type=\"button\" value=\"Cancel\"><input id=\"fancyConfirm_ok\" style=\"margin:3px;padding:0px;\" type=\"button\" value=\"Ok\"></div></div>",
onComplete : function() {
jQuery("#fancyConfirm_cancel").click(function() {
ret = false;
jQuery.fancybox.close();
})
jQuery("#fancyConfirm_ok").click(function() {
ret = true;
jQuery.fancybox.close();
})
},
onClosed : function() {
if (typeof callback == 'function'){ callback.call(this, ret); };
}
});
}
function fancyConfirm_text() {
fancyConfirm("Ceci est un test", function(ret) {
alert(ret)
})
}
and im using a hyperlink like this:
我使用这样的超链接:
<a href="http://www.example.com/" onclick="fancyConfirm("Are you sure you want to delete?");">Test</a>
im stuck, it just wont display anything?, i think its got something to do with the callback variable required for fancyConfirm but im unsure what that means and how it applies.
我被卡住了,它只是不会显示任何东西?,我认为它与fancyConfirm所需的回调变量有关,但我不确定这意味着什么以及它是如何应用的。
thanks for your help.
谢谢你的帮助。
回答by Jason LeBrun
There's an error in your link attribute. You can't place double-quotes inside of double-quotes without escaping them. Right now, your onclick attribute is just: "fancyConfirm("
您的链接属性有错误。您不能在不转义双引号的情况下将双引号放在双引号内。现在,您的 onclick 属性只是:“fancyConfirm(”
Try:
尝试:
<a href="http://www.example.com/" onclick="fancyConfirm('Are you sure you want to delete?');">Test</a>
Or:
或者:
<a href="http://www.example.com/" onclick="fancyConfirm(\"Are you sure you want to delete?\");">Test</a>
回答by Nathan
You need this instead:
你需要这个:
<a href="#" onclick="fancyConfirm('Are you sure you want to delete?');return false;">Test</a>
That should work. The hash (#) wont show in the URL because return false;
will only make what is in the onclick
happen.
那应该有效。哈希 (#) 不会显示在 URL 中,因为return false;
只会使onclick
发生的事情发生。
Also, I know this is obvious, but do you have Fancybox and jQuery defined on the page?
另外,我知道这很明显,但是您在页面上定义了 Fancybox 和 jQuery 吗?
回答by SyAu
Have a look at this post,
看看这个帖子,
Javascript/Jquery Callback for Fancybox Yes No Confirm
Fancybox 的 Javascript/Jquery 回调 是 否 确认
The author of fancy box has a slightly different solution and it works.
花式框的作者有一个稍微不同的解决方案,它的工作原理。