Question

我有一个表单，我希望用户确认他们的订单是正确的。我以这种方式获得两个弹出窗口，只需要一个总结订单并提示确认消息。当用户单击“确定”时，弹出窗口将关闭并返回到表单以进行提交（有一个提交按钮）。但是，如果用户单击取消，则表单将重置并弹出窗口关闭。任何帮助表示赞赏。谢谢注意：这是评估的一部分，即使有更好的方法，也需要这样做。

// JavaScript文档

function display() {
    var x=document.confirm.qty.value; 
    var y=document.confirm.price.value; 
    var z=document.confirm.total.value;
    alert("Quantity:"+x+" \n "+"Price Each:"+y+" \n "+"Total Price:"+z );  

    if(confirm('Confirm your order?'));
}

Answer 1

您实际上在寻找window.confirm()。这是显示两个按钮的对话框：确定和取消。它还返回一个布尔值，指示是否选择了“确定”或“取消”。

假设您的display函数是onSubmit处理程序，您可以像这样重写它：

function display(event) {
    var x = document.querySelector('[name="qty"]'),
        y = document.querySelector('[name="price"]'),
        z = document.querySelector('[name="total"]');

    // Simplified string creation with ES6 String Interpolation
    var confirm = window.confirm(`
        Quantity: ${x.value}
        Price Each: ${y.value}
        Total Price: ${z.value}
    `);

    if (confirm == true) {
        // All OK
        return;
    } else {
        // Blocking default `submit` event
        event.preventDefault();

        // Resetting form
        x.value = null;
        y.value = null;
        z.value = null;

        return;
    }
}

不要忘记将event传递给回调：

<form onsubmit="display(event);">

Answer 2

应该是

return confirm('...

进一步确保onclick已在HTML中的方法名称前面返回。

Answer 3

Popups对于这个用例非常罕见。创建一个覆盖整个站点的div（使所有其他东西都不可点击）。在那个div中创建另一个在请求确认的中心位置。

Answer 4

我想你想要这样的东西：

function display()
{
    var x = document.getElementById('qty').value; 
    var y = document.getElementById('price').value; 
    var z = document.getElementById('total').value;

    var result = confirm('Quantity:' + x + '\nPrice Each: ' + y + '\nTotal Price: ' + z + '\n\nConfirm your order?');
    if(result)
    {
        // user has pressed OK
    }
    else
    {
        // user has pressed cancel
    }
}

Javascript弹出/警报

4 个答案: