Question

我有一个带有搜索按钮的asp.net网页。当点击该按钮时，会出现一个jquery对话框，用户必须确认他们要继续或取消。如果他们点击确认按钮，搜索按钮后面的c＃代码必须继续执行，如果单击取消，则必须关闭对话框，没有其他任何事情发生。我用来显示模式弹出的jQuery在下面

    $(document).ready(function () {
        $("#<%=butSearch.ClientID%>").click(function (e) { // Button which will activate our modal
            $('#modal').reveal({ // The item which will be opened with reveal
                animation: 'fade',                   // fade, fadeAndPop, none
                animationspeed: 600,                       // how fast animtions are
                closeonbackgroundclick: true,              // if you click background will modal close?
                dismissmodalclass: 'close'    // the class of a button or element that will close an open modal
            });
            return false;
        });
    });


<div id="modal">
    <div id="heading">
         Search Notification
    </div>

    <div id="content">
        <p>Please be aware that any search via the xxxx, will incur a cost. Do you wish to proceed?</p>

        <a href="#" class="button green close"><img src="../../Imgs/dialog_tick.png">Proceed</a>
        <a href="#" class="button red close"><img src="../../Imgs/dialog_cross.png">Cancel</a>
    </div>
</div>

Answer 1

假设我正在查看right plugin，似乎没有任何选项可以传递给此插件，以便对配置的关闭按钮做出不同的响应。

但是，没有理由不将事件附加到您有兴趣执行其他操作的按钮上。在你的情况下，我认为这是继续按钮，你想要对服务器进行ajax调用：

$('#modal .button.green.close').click(function(){
   $.ajax(...)
});

在该示例中，$.ajax可以替换任何jquery ajax方法。

Answer 2

好的，你可以先尝试一下，确保弹出模态弹出窗口表单，然后简单地使用jQuery提交表单，以防用户点击Proceed。

$(document).ready(function () {
    $("#<%=butSearch.ClientID%>").click(function (e) { // Button which will activate our modal
        $('#modal').reveal({ // The item which will be opened with reveal
            animation: 'fade',                   // fade, fadeAndPop, none
            animationspeed: 600,                       // how fast animtions are
            closeonbackgroundclick: true,              // if you click background will modal close?
            dismissmodalclass: 'close'    // the class of a button or element that will close an open modal
        });
        jQuery("#modal").parent().appendTo(jQuery("form:first")); // This will append the dialog to the form ensuring values are sent during postback.
        return false;
    });
}); 



<div id="modal">
<div id="heading">
     Search Notification
</div>

<div id="content">
    <p>Please be aware that any search via the xxxx, will incur a cost. Do you wish to proceed?</p>

    <a href="#" id="anchorProceed" onclick="javascript:proceed()" class="button green close"><img src="../../Imgs/dialog_tick.png">Proceed</a>
    <a href="#" id="anchorCancel" class="button red close"><img src="../../Imgs/dialog_cross.png">Cancel</a>
</div>

function proceed(){
 $( "#yourFormID" ).submit();
}

单击jquery对话框后执行c＃代码单击确定按钮

2 个答案: