如何让fancybox显示一个“是/否确认框”?通过href onclick

How can i make fancybox display a "yes/no confirm box" via a href onclick?

本文关键字：确认 onclick href 通过 显示 fancybox 一个      更新时间：2023-09-26

我使用下面的代码代替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)
    })
}

和我使用的超链接像这样:

<a href="http://www.example.com/" onclick="fancyConfirm("Are you sure you want to delete?");">Test</a>

我卡住了，它只是不显示任何东西?，我认为它与fancyConfirm所需的回调变量有关，但我不确定这意味着什么以及它如何应用。

谢谢你的帮助。

您的link属性有错误。你不能把双引号放在双引号里面而不转义。现在，你的onclick属性只是:"fancyConfirm("

试题:

<a href="http://www.example.com/" onclick="fancyConfirm('Are you sure you want to delete?');">Test</a>

或:

<a href="http://www.example.com/" onclick="fancyConfirm('"Are you sure you want to delete?'");">Test</a>

你需要的是这个:

<a href="#" onclick="fancyConfirm('Are you sure you want to delete?');return false;">Test</a>

应该可以。哈希(#)不会在URL中显示，因为return false;只会使onclick中的内容发生。

另外，我知道这是显而易见的，但是你有在页面上定义的Fancybox和jQuery吗?

看看这篇文章，

Javascript/Jquery Callback for Fancybox是否确认

fancy box的作者有一个稍微不同的解决方案，它可以工作。

相关文章：