Javascript: Confirm Box

Javascript: Confirm Box

本文关键字：Box Confirm Javascript      更新时间：2023-09-26

我有一个表单，有两个提交按钮（是和否），

我有一个自定义div的javascript，用户必须确认他的选择。

我的问题是，当我点击yes按钮或no按钮时，总是打开2个div。

我该怎么解决？

我想让一个div为yes打开，另一个为no打开。

演示：

小提琴演示

MY Javascript代码：

 function doConfirm(msg, yesFn, noFn) {
        var confirmBox = $("#confirmBox");
        confirmBox.find(".message").text(msg);
        confirmBox.find(".yes,.no").unbind().click(function () {
            confirmBox.hide();
        });
        confirmBox.find(".yes").click(yesFn);
        confirmBox.find(".no").click(noFn);
        confirmBox.show();
    }
    function doReject(msg, yesFn, noFn) {
        var rejectBox = $("#RejectBox");
        rejectBox.find(".message").text(msg);
        rejectBox.find(".yes,.no").unbind().click(function () {
            rejectBox.hide();
        });
        rejectBox.find(".yes").click(yesFn);
        rejectBox.find(".no").click(noFn);
        rejectBox.show();
    }
    $(function () {
        $("form").submit(function (e) {
            e.preventDefault();
            var form = this;
            doConfirm("Confirma a validação deste Caso Suporte?", function yes() {
                form.submit();
            });
            doReject("Rejeitar?", function no() {
                // do nothing
            });
        });
    });

无论何时提交表单，都会调用这两个提示函数。这两个按钮都是提交按钮，因此在每种情况下都会调用这两个函数。你需要一种区分这两个按钮的方法。试试这样的东西：

$('form').find('button[type=submit]').click(function(e){
    e.preventDefault();
    $form = $(this).closest('form');
    if(this.name == 'yes'){
        doConfirm("Confirm that you want to validate?", function yes() {
            $form.submit();
        });
    } else {
        doReject("Confirm that you want reject?", function no() {
            // do nothing
        });
    }
});

JSFiddle

使用以下内容：

var confirm; 
function doConfirm(msg, yesFn, noFn) {
    confirm = true;
        var confirmBox = $("#confirmBox");
        confirmBox.find(".message").text(msg);
        confirmBox.find(".yes,.no").unbind().click(function () {
            confirmBox.hide();
        });
        confirmBox.find(".yes").click(yesFn);
        confirmBox.find(".no").click(noFn);
        confirmBox.show();
    }
    function doReject(msg, yesFn, noFn) {
        confirm = false;
        var rejectBox = $("#RejectBox");
        rejectBox.find(".message").text(msg);
        rejectBox.find(".yes,.no").unbind().click(function () {
            rejectBox.hide();
        });
        rejectBox.find(".yes").click(yesFn);
        rejectBox.find(".no").click(noFn);
        rejectBox.show();
    }
    $(function () {
        $("form").submit(function (e) {
            e.preventDefault();
            var form = this;
            if(confirm){
            doConfirm("Confirm that you want to validate?", function yes() {
                form.submit();
            });} 
            else{
            doReject("Confirm that you want reject?", function no() {
                // do nothing
            });}
        });
    });

我用if语句做了一个简单的检查。单击"拒绝"时，确认值等于true，如果单击"拒绝按钮"，则确认值等于false。

小提琴：http://jsfiddle.net/5UbS6/3

您的问题是同时调用doConfirm和doReject。根据他们点击的按钮写一个条件（是或否）。

相关文章：