Question

当用户点击链接时是否可以阻止页面，并且只有在响应从服务器返回后才启用它。我最近遇到了一个问题，即在页面上多次点击链接会导致同时发生两次更改。

问题是页面允许多次提交。我已经使用Struts saveToken（）和isValidToken（）在服务器端解决了这个问题，以防止再次发生这种情况。这将确保如果收到多个提交，则不处理第二个提交。

现在我遇到的问题是，如果用户点击两次提交链接，则第一个请求有效，但第二个请求无效。用户被重定向到错误页面，没有意识到第一个请求确实通过了。

我认为解决方案是在点击链接时阻止/禁用链接。我知道你可以使用javascript来禁用链接，但我想使用我在几个网站上看到的一个AJAXy模式对话框。基本上，当您单击链接时，会出现一个弹出对话框，其中显示消息“Please wait ..”。后台淡出，用户在响应从服务器返回之前无法执行任何操作。我看到的大多数示例似乎都是基于Ajax的。我的页面不使用Ajax。

实现此模式对话框的最简单方法是什么？我一直在环顾四周，有几个可用于JQuery的插件，但考虑到我是新手，我不太明白。有人能告诉我如何使用Jquery做这个吗？

由于

修改

以此为例，

            //CONTROLLING EVENTS IN jQuery
            $(document).ready(function(){

                //LOADING POPUP
                //Click the button event!
                $("#button").click(function(){
                    //centering with css
                    centerPopup();
                    //load popup
                    loadPopup();
                });

                //CLOSING POPUP
                //Click the x event!
                $("#popupContactClose").click(function(){
                    disablePopup();
                });
                //Click out event!
                $("#backgroundPopup").click(function(){
                    disablePopup();
                });
                //Press Escape event!
                $(document).keypress(function(e){
                    if(e.keyCode==27 && popupStatus==1){
                        disablePopup();
                    }
                });

            });

我想在点击链接时触发这些事件。链接本身指向另一个javascript函数。即

<a href="javascript:submitform();">confirm</a>

如何调用submitform（）javascript函数中的jquery位？在submitform（）完成后优先。

Answer 1

查看jQuery.dialog（website），它允许您将页内div显示为模态，或者甚至从其他页面获取您的内容。

<div id="progress" class="dialogContent" style="text-align: left; display: none;">
<img src="../../global/style/default/images/ajax-loader.gif" style="margin-right: 5px;" />
<asp:literal id="literalPleaseWait" runat="server" text="Please wait..." />
</div>

然后调用下面的函数来显示对话框

 function ShowProgressAnimation() {
    var pleaseWaitDialog = $("#progress").dialog(
    {
    resizable: false,
    height: 'auto',
    width: 150,
    modal: true,
    closeText: '',
    bgiframe: true,
    closeOnEscape: false,
    open: function(type, data) {
    $(this).parent().appendTo($("form:first"));
    $('body').css('overflow', 'auto'); //IE scrollbar fix for long checklist templates
    }
    });
    }

Answer 2

您可以使用透明度覆盖绝对定位的div图层，捕捉任何鼠标点击，防止页面中的任何对象发生反应。

然后是另一个显示消息的div。

有几个js库可以做这些事情，很多是基于jQuery构建的，所以请看jquery模式弹出窗口。

Answer 3

在你执行form.submit（）之后你在submitform（）里面直接调用centerPopup（）和loadPopup（）来显示弹出窗口

使用Jquery显示模式“请稍候”对话框消息

修改

3 个答案: