5

ユーザーが ASP.NET Web フォーム ページを閉じるか、別の場所に移動した場合にのみ、ユーザーにメッセージを表示したいと考えています。ボタン、LinkBut​​ton、AutoPostBack 要素、またはポストバックするその他のものをクリックすると、メッセージを表示したくありません。

これまでのところ、次のコードがあります。

<script type="text/javascript">

var postback = false;

addToPostBack = function(func) {
    var old__doPostBack = __doPostBack;
    if (typeof __doPostBack != "function") {
        __doPostBack = func;
    } else {
        __doPostBack = function(t, a) {
            if (func(t, a)) old__doPostBack(t, a);
        }
    }
};

$(document).ready(function() {
    addToPostBack(function(t,a) {
        postback = true;
    });
});

$(window).bind("beforeunload", function() {
    if (!postback) {
        return "message";
    }
});
</script>

これは部分的に機能しますが、AutoPostBack イベントの発生を停止するようで、LinkBut​​tons などのメッセージが引き続き表示されます。

これどうやってするの？

4

4 に答える 4

3

これは、__doPostBack が呼び出されたときのタイムスタンプを取得し、デフォルトの動作を実行します。

onbeforeunload イベントは、カスタム メッセージのタイムスタンプと最新の __doPostBack タイムスタンプの差が allowedWaitTime よりも大きい場合にのみカスタム メッセージを表示します。

使用法: ページの任意の場所に含めます。

アップデート：

これで WebForm_DoPostBackWithOptions も処理されるようになりました

(function ($) {

    if (typeof $ !== 'function') {
        throw new Error('jQuery required');
    }

    /* The time in milliseconds to allow between a __doPostBack call and 
       showing the onbeforeunload message. */
    var allowedWaitTime = 100,

        timeStamp = new Date().getTime(),

        // Each function to override
        baseFuncs = {
            __doPostBack: this.__doPostBack,
            WebForm_DoPostBackWithOptions: this.WebForm_DoPostBackWithOptions
        };

    // Set timeStamp when each baseFunc is called
    for (var baseFunc in baseFuncs) {
        (function (func) {
            this[func] = function () {
                var baseFunc = baseFuncs[func];
                timeStamp = new Date().getTime();
                if (typeof baseFunc === 'function') {
                    baseFunc.apply(arguments.callee, arguments);
                }
            }
        })(baseFunc);
    }

    /* Form submit buttons don't call __doPostBack so we'll set timeStamp 
       manually on click. */
    $('input[type="submit"]').click(function () {
        timeStamp = new Date().getTime();
    });

    $(this).on('beforeunload', function (e) {

        // Only return string if allowedWaitTime has elapsed
        if (e.timeStamp - timeStamp > allowedWaitTime) {
            return 'message';
        }
    });
}).call(window, jQuery);
于 2013-08-23T11:17:29.360 に答える
0

これを試してください:-

jQuery(function ($) {
    $(document).on("click", function () {
        window.onbeforeunload = null;
    });

});

window.onbeforeunload = function (event) {
    return "message";
}
于 2013-08-23T09:29:51.150 に答える
0

リンクボタンとボタンセットonclick="$(window).unbind("beforeunload");return true;"

autopostback 要素を設定するonchangeか、autopostback を設定する原因となったものを設定する必要がありますonchange="$(window).unbind("beforeunload");return true;"

ポストバックが発生した後、必ず beforeunload を再度バインドしてください。

于 2013-08-25T10:42:39.313 に答える
0

これは、次のコードを使用して実現できます。

<script type="text/javascript">
        var isChanged = false;
        $(document).ready(function () {
            $('input').click(function () {
                isChanged = true;
            });
            $('select').click(function () {
                isChanged = true; 
            });
        });

        $(window).bind("beforeunload", function () {
            if (isChanged) {
                return '>>>>>Before You Go<<<<<<<< \n Your custom message go here';                
                }           
        })

    </script>

これは、ユーザーがフォームのinput(ボタン) またはselect(ドロップダウンリスト) をクリックすると機能します。

完全なコードは次のとおりです。

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
    <script type="text/javascript">
        var isChanged = false;
        $(document).ready(function () {
            $('input').click(function () {
                isChanged = true;                

            });
            $('select').click(function () {
                isChanged = true;                

            });
        });

        $(window).bind("beforeunload", function () {
            if (isChanged) {
                return '>>>>>Before You Go<<<<<<<< \n Your custom message go here';                
                }           
        })

    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <table border="0" cellpadding="0" cellspacing="0">
            <tr>
                <td>
                    <asp:TextBox runat="server" ID="txtbox" />      
                </td>
            </tr>
            <tr>
                <td>
                    <asp:Button Text="button" runat="server" ID="btn" />
                </td>
            </tr>
            <tr>
                <td>
                    <asp:DropDownList runat="server" ID="ddl">
                        <asp:ListItem Text="One" />
                        <asp:ListItem Text="Two" />
                    </asp:DropDownList>
                </td>
            </tr>
            <tr>
                <td>
                    <asp:CheckBox Text="Check" runat="server" ID="chk" />
                </td>
            </tr>
            <tr>
                <td>
                    <asp:RadioButtonList runat="server" ID="radio">
                        <asp:ListItem Text="One" />
                        <asp:ListItem Text="Two" />
                    </asp:RadioButtonList>
                </td>
            </tr>


        </table>
    </div>
    </form>
</body>
</html>
于 2013-08-23T10:42:28.193 に答える