HTML表单和Javascript确认

时间:2009-08-31 07:51:21

标签: javascript webforms html-form confirm

我在提交表单和Javascript确认时遇到问题。基本上,当按下“提交”按钮时,会调用以下Javascript。

function confirmation() {
    var answer = confirm("Are you sure you wish to edit?")
    if (answer)
    {
        window.location = "#editform2";
    }
}

然而,当我点击取消而不是ok时,Javascript正确执行,因为我看地址栏并且它没有更新到#editform2。但是,表格仍然提交。它似乎刷新了页面。以下是表格中的相关部分:

//Form is encoded in PHP
<form method=\"post\">
//Form is in here
<input type=\"submit\" value=\"Edit\" onclick=\"confirmation()\">

因此表单不知道它在哪里,它只是刷新页面,页面恰好也是处理器。所以即使我点击取消它也正在处理,Javascript应该保持在同一页面上。除了将处理移到另一页之外,我的解决方案是什么?

3 个答案:

答案 0 :(得分:6)

它的工作原理是这样的,因为它是一个sumbit按钮,表格在每种情况下都会提交。为表单分配一个id并更改输入类型:

<form method="post" id="formid">
<input type="button" value="Edit" onclick="confirmation()">

并在点击时调用此函数:

function confirmation() {
    var answer = confirm("Are you sure you wish to edit?")
    if (answer)
    {
        document.getElementById("formid").submit();
    }
}

答案 1 :(得分:4)

请勿使用提交按钮的onclick事件,请使用表单的onsubmit事件:

document.forms[0].onsubmit = function () {
    return confirm("Are you sure you wish to edit?");
}

您可能希望在表单中添加id属性以识别它。

保持对JavaScript代码的事件绑定;不是HTML上的内联属性,使您的代码更易于管理,并且易于调试。

答案 2 :(得分:1)

尝试:

return answer;

在函数结束时确保onclick方法返回此值。像这样:

<input type="submit" value="Edit" onclick="return confirmation()">

这会使函数返回false并且不会发布表单。