Question

我想在用户选择DropDownList中的项目时显示确认对话框。如果用户按“取消”，我想停止回发。这是我添加到onchange事件的函数：

function imitateConfirmUnload(event) {
    if (window.onbeforeunload = null)
        return true;

    return confirm("Are you sure you want to navigate away from this page?\n\nYou have unsaved changes\n\nPress OK to continue or Cancel to stay on the current page.");
}

这是我的启动脚本中的相关代码，用于将处理程序添加到事件中：

function addConfirmToWarnClasses() {

    $('.warn').change(function() {
        imitateConfirmUnload()
    });
}

问题是即使用户选择“取消”也会发生回发。如果我将处理程序移动到click事件，它就可以工作。但是我觉得很笨。

修改

更正：它不起作用，因为对话框阻止了选择，因此当用户选择“确定”时，没有发生任何更改，并且在您需要时没有回发！

修改2

DropDownList位于UpdatePanel内部，因此可能会影响行为。

Answer 1

在阅读this solution之后，我刚刚删除AutoPostBack上的DropDownLists并使用了它，因为它非常简单：

$("#DropDownList1").change(function (e) {
    if ($(this).val() == "0") {
        //do nothing
    }
    else {
        //do postback
        setTimeout("__doPostBack('DropDownList1','')", 0);
    }
});

或者如果您有多个DropDownLists，则需要AutoPostBack：

$("select").change(function (e) {
    if ($(this).val() == "0") {
        //do nothing
    }
    else {
        //do postback
        setTimeout("__doPostBack('" + this.id + "','')", 0);
    }
});

Answer 2

您也需要return来自该功能，如下所示：

$('.warn').change(imitateConfirmUnload);

目前未使用return值。这也可行：

$('.warn').change(function() {
  return imitateConfirmUnload();
});

另外，我漂亮确定你想在这里进行等号检查：

if (window.onbeforeunload == null)
    return true;

目前它正在使onbeforeunload处理程序归零。

Answer 3

我知道这个问题有点陈旧，但是当我需要答案时，谷歌搜索会弹出，我会在这里发布解决方案。我认为它比以前发布的更为简单。

我是从http://forums.asp.net/p/1475520/3432980.aspx获取的：

<script type="text/javascript">
    function stopPostback()
    {
        if (blahblah)
            return true; // stop postback


        return false;
    }
</script>

<asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True" onchange="if (stopPostback()) return false;">

这里的关键部分是onchage中的代码：取消AutoPostBack它必须返回一些东西（无论是真还是假）并继续使用AutoPostBack它不应该返回任何东西。

Answer 4

果然，从更新面板取消异步回发需要采用不同的技术：

http://msdn.microsoft.com/en-us/magazine/cc163413.aspx

Prevent ASP.net __doPostback() from jQuery submit() within UpdatePanel

//Adds an event handler to confirm unsaved changes when an asynchronous postback is initialised by an UpdatePanel
function setConfirmAsyncPostBack() {

    if (typeof (Sys.WebForms) === "undefined" || typeof (Sys.WebForms.PageRequestManager) === "undefined")
        return;

    var prm = Sys.WebForms.PageRequestManager.getInstance();
    prm.add_initializeRequest(confirmAsyncPostBack);
}

//An event handler for asynchronous postbacks that confirms unsaved changes, cancelling the postback if they are not confirmed
//Adds the confirmation to elements that have a css class of "warn"
function confirmAsyncPostBack(sender, args) {
    if (window.onbeforeunload != null && args.get_postBackElement().className == "warn" && !unloadConfirmed())
        args.set_cancel(true);
}

//Displays a confirmation dialog that imitates the dialog displayed by onbeforeunload
function unloadConfirmed() {

    var confirmed = confirm("Are you sure you want to navigate away from this page?\n\n" + unloadMessage() + "\n\nPress OK to continue or Cancel to stay on the current page.");
    if (confirmed)
        window.onbeforeunload = null;
    return confirmed;
}

function unloadMessage() {

    return 'You have unsaved changes.';
}

此代码与我在其他问题中描述的问题有关：DropDownList not firing onbeforeunload when AutoPostBack="True"

使用jQuery选择DropDownlist时如何防止AutoPostBack

4 个答案: