Javascript JS和PHP之间的控制流

我很难理解来自JS和PHP的代码流

我想首先验证表单内容，如果值没有问题，我想在PHP文件中处理相同的内容

我相信调用JS函数来检查验证，我们需要一个onsubmit函数。我知道要转发html处理，我需要在操作中指定php文件名。请帮我解释一下如何计算控制流程

尝试使用

onsubmit（）

和php表单数据解析

<form id="locationForm" action="<?php $_SERVER['PHP_SELF']; ?>"  method = "POST" onSubmit="validate()" > 

<div class = "rht">
        <input type="checkbox" id = "current"><b>Current Location</b><br>
</div>
<input  type="submit"  name= "submit" value="Submit">
</form>


<script>
function validate()
        {
            console.log('Inside val');
}

<?php         
         if (isset($_POST['submit'])) {
             $abc = $_POST['abc'];
         }
?>

</script>

---

如果我理解正确，您希望使用Javascript（客户端验证）验证表单，如果通过验证，则发送表单供PHP处理（服务器端处理）

当涉及到web开发，特别是表单和验证时，从请求和响应（或客户机和服务器）的角度来考虑确实很有帮助。浏览器（客户端）发出请求，服务器发送响应。这听起来很简单，但当你试图围绕这些问题思考时，往往会被忽略

此表单的正常使用情况是两个简单的请求-第一个是页面初始加载时的
get
请求，第二个是表单提交时的
post
请求。这就是它看起来的样子


浏览到时，浏览器会向服务器发送
get
请求。服务器跳过第一个
if
语句，因为它不是
post
请求，并将响应（仅HTML和JS）发送回浏览器
最终用户在浏览器中与表单交互，JS阻止他们提交表单，直到表单有效。一旦表单有效并提交，就会向服务器发送一个新的
post
请求
现在，服务器将执行
if
语句，因为请求是
post
最后，在处理之后，服务器将再次将响应（HTML和JS）发送回浏览器

我在代码中嵌入了我的大部分注释。请注意，这仅使用客户端验证。除了一个简单的示例之外，在任何应用程序中，您都应该同时进行客户端和服务器端验证

<?php

// This will only execute if the form was submitted. 
// We're making the assumption that if the form was submitted then it was valid. 
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
   // If you were going to do server-side validation, this is where you'd do it. 

   // Do your processing in here.
   $name = $_POST['name'];
}
?>

<!-- We don't need to specify an action if we want the current script to process the form. -->
<!-- Notice onSubmit needs the `return` keyword to actually stop the form from submitting. -->
<!-- Also notice, that the Javascript validation needs to return a boolean. -->
<form id="name-form" method="post" onSubmit="return validate(this)">

    <label>
        <input type="text" name="name">
        Name
    </label>

    <br>

    <input type="submit" name="submit" value="Submit">
</form>


<script>
    /**
     * Client-side validation. This method will return a boolean indicating if the given form is valid.
     * @param form
     * @returns {boolean}
     */
    function validate(form) {
        var name = form.name.value;

        // Return the inverse of the comparison.
        return !(name === '');
    }
</script>

另外，请注意，使用现代浏览器，您只需将
required
属性添加到表单元素，浏览器将处理验证。您可以使用大量的内置验证。我强烈建议您阅读并理解Javascript、HTML5和服务器端验证之间的区别

<?php

// This will only execute if the form was submitted. 
// We're making the assumption that if the form was submitted then it was valid. 
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
   // If you were going to do server-side validation, this is where you'd do it. 

   // Do your processing in here.
   $name = $_POST['name'];
}
?>

<!-- We don't need to specify an action if we want the current script to process the form. -->
<!-- Notice onSubmit needs the `return` keyword to actually stop the form from submitting. -->
<!-- Also notice, that the Javascript validation needs to return a boolean. -->
<form id="name-form" method="post" onSubmit="return validate(this)">

    <label>
        <input type="text" name="name">
        Name
    </label>

    <br>

    <input type="submit" name="submit" value="Submit">
</form>


<script>
    /**
     * Client-side validation. This method will return a boolean indicating if the given form is valid.
     * @param form
     * @returns {boolean}
     */
    function validate(form) {
        var name = form.name.value;

        // Return the inverse of the comparison.
        return !(name === '');
    }
</script>


名称


/**
*客户端验证。此方法将返回一个布尔值，指示给定的表单是否有效。
*@param形式
*@returns{boolean}
*/
函数验证（表单）{
var name=form.name.value；
//返回比较的倒数。
返回！（名称=“”）；
}
我会尽力为您解答这个问题。给我15分钟写点东西。