Question

我是网络/ javascript编程的初学者，想知道是否有人可以在使用预定义按钮提交多个提交按钮的表单之前给我一个简单的模态确认对话框示例？我偶然发现了jQuery和SimpleModal，并想知道它是否适合我的ASP MVC项目。

我最终得到了以下非工作代码，我认为我的第一个问题是不知道如何从对话框中返回一个值？：

<script type="text/javascript">
    $(document).ready(function() {
    $("form").submit(function(ev) {
            return confirm("Confirm?");
        });
    });

    function confirm(message) {
        $("#confirm").modal({
            close: true,
            overlayId: "confirmModalOverlay",
            containerId: "confirmModalContainer",
            onShow: function modalShow(dialog) {
                dialog.overlay.fadeIn("slow", function() {
                    dialog.container.fadeIn("fast", function() {
                        dialog.data.hide().slideDown("slow");
                    });
                });

                dialog.data.find(".confirmMessage").append(message);
                dialog.data.find(".btnYes").click(function() {
                    $.modal.close();                                       
                });
            }
        })
    }        
</script>


<div id="confirm" style="display:none">
    <a href="#" title="Close" class="modalCloseX simplemodal-close">x</a>
    <div class="confirmHeader"><span>Confirm</span></div>
    <p class="confirmMessage"></p>
    <div class="buttons">
        <div class="btnYes">Yes</div><div class="btnNo simplemodal-close">No</div>
    </div>
</div>

如果有人将我带到网上某处进行网络编程速成课程，那将是很好的。）

Answer 1

就个人而言，我并没有这么做。

Boxy是一个jQuery插件，已经有一个确认框控件。

它的例子如下：

$('#confirm-actuator').click(function() {
    Boxy.confirm("Please confirm:", function() { alert('Confirmed!'); }, {title: 'Message'});
    return false;
});

如果您查看Boxy网站本身，它还会向您展示如何检索提交的值等。

编辑：您的实施将是....

 $(document).ready(function() {
    $("form").submit(function(ev) {
        $('#mySubmitBtn').click(function() {
            Boxy.confirm("Are you sure?", function() { /**DO ACTION FOR CONFIRM**/ }, {title: 'Confirm'});
            return false;
        });
    });

});

然后在mySubmitBtn的提交按钮上放置一个ID。

我手边没有测试过那些代码，但希望能够做到这一点。

希望这有帮助。

虽然根据开发人员的说法，此方法不旨在替换浏览器提供的本机window.confirm（）函数，因为它无法在对话框可见时阻止程序执行。

但是，我认为这不会影响您的表单提交，因此您应该使用此方法。

Answer 2

以下是实现此目的的3种不同方法的细分：

Modal Confirmation Dialog on Form Submit

Answer 3

提交表单时，您无需使用jquery进行简单的模态确认对话框。浏览器提供了一些模态系统查找对话框。一个是“确认”。

这个简单的javascript可以：

<form method="post" action="myurl.aspx" onsubmit="return confirm('Submit this form?')">
...
</form>

对于速成课程，您可以查看W3Schools或只搜索Google以获取教程。

如何在提交表单之前进行模态确认对话框？

3 个答案: