js form表单提交

作者：步尘の若云发布日期:2025-08-31 浏览:93

<!DOCTYPE html>
<html>
<head>
    <title>JS Form 表单提交示例</title>
</head>
<body>
    <form id="myForm" action="/submit" method="POST">
        <label for="name">姓名:</label>
        <input type="text" id="name" name="name"><br><br>
        <label for="email">邮箱:</label>
        <input type="email" id="email" name="email"><br><br>
        <input type="button" value="提交" onclick="submitForm()">
    </form>

    <script>
        function submitForm() {
            // 获取表单元素
            var form = document.getElementById("myForm");

            // 检查表单验证（这里只是一个简单的示例，实际应用中可能需要更复杂的验证）
            if (document.getElementById("name").value === "" || document.getElementById("email").value === "") {
                alert("请填写所有字段！");
                return;
            }

            // 提交表单
            form.submit();
        }
    </script>
</body>
</html>

解释说明：

HTML部分:
- 创建了一个包含两个输入字段（姓名和邮箱）的表单。
- 表单的 action 属性指定了提交的目标 URL（在这个例子中是 /submit），method 属性指定了提交的方式（POST）。
- 提交按钮使用了 type="button" 并绑定了 onclick 事件，点击按钮时会调用 JavaScript 函数 submitForm()。
JavaScript部分:
- submitForm() 函数用于处理表单提交逻辑。
- 首先获取表单元素并进行简单的验证，确保所有字段都已填写。如果未填写，则弹出提示框并阻止提交。
- 如果验证通过，则调用 form.submit() 方法提交表单。

上一篇：nodejs electron

下一篇：js for循环异步请求按顺序执行