【问题标题】:Only submit form if a condition is met?仅在满足条件时才提交表单?
【发布时间】:2011-05-13 12:41:08
【问题描述】:

现在我有一个基本的购物车设置。当用户输入他们的信息时,我想将此数据写入 XML 文件。为此,我一直在使用 POST 提交表单的方法。但是,我只想在满足条件(例如使用正则表达式以确保电话号码中没有字母)的情况下提交此表单以进行保存。

所以我的表格是这样的:

<form action= "confirmation.php" name="memberData" method="post">
        <input name="textField" id="textField"></input>
        <input type="submit" name="submitbutton" id="submitbutton" onclick="submitIt()" value="Submit Button"/>
    </form>

所以我想要调用这个 submitIt() 函数来检查数据是否有效。如果它有效,那么我想执行我的表单操作。否则,我希望它在用户修复他们输入的信息之前不会重定向。现在它确实会正确地提醒用户一个不正确的字段,但在它重定向并保存信息之后会立即发生。

有没有办法只在满足特定条件时才执行表单操作?

【问题讨论】:

标签: php html webforms


【解决方案1】:

您在这里要做的是阻止事件的默认操作,在您的案例表单提交中。为此,处理程序应返回 false。为了使其工作,您必须将处理程序从提交按钮的 onClick 更改为表单的 onSubmit。

您还可以在http://www.quirksmode.org/js/introevents.html 阅读有关活动的一些信息。

【讨论】:

    【解决方案2】:

    你可以这样做:

    <form ... onsubmit="return submitIt();">
    

    submitIt() 是一个 JavaScript 函数,如果有效则返回 true,如果无效则返回 false。

    【讨论】:

      【解决方案3】:

      您需要通过取消正在处理的事件来停止处理表单。见this example

      请注意,如果禁用 JavaScript,这显然不会运行,因此您仍然需要在服务器端执行这些检查并在服务器端适当地处理验证错误。

      【讨论】:

      • 所以为了让它工作,我应该在 submitIt() 函数中调用 cancelEvent()?
      【解决方案4】:

      另外,请查看许多 JQuery 插件。

      http://plugins.jquery.com/plugin-tags/form-validation

      通过几个简单的示例并将所有内容正确包含在页面中后,表单验证在您的所有网站上变得非常容易和灵活。

      另外,我确实看到了在用户不离开页面的情况下进行客户端验证的必要性,但不要忘记在提交表单时您仍必须清理和检查表单字段。恶意用户可以简单地禁用 JavaScript 以通过验证,或者使用 NoScript 运行的用户甚至不会意识到正在进行验证。

      【讨论】:

        猜你喜欢
        • 2022-12-29
        • 1970-01-01
        • 1970-01-01
        • 2018-01-22
        • 1970-01-01
        • 2013-06-11
        • 2018-09-24
        • 1970-01-01
        • 2021-08-25
        相关资源
        最近更新 更多