JavaScript 以 html 形式验证

Question

在我的页面中，我需要输入标题、内容、图片等几项内容。此信息将发送到 script.php，我需要使用 php 验证这些内容，但出现错误。

这就是我包含 JavaScript 的方式：

<script type="text/javascript" src="jquery-1.11.0.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.1/jquery.validate.min.js"></script>
    <script src="js/form-validation.js"></script>

在头上我写了 JS：

        <script type="text/javascript">
      document.getElementById("submit").onclick=function(event)
    </script>

这是 html 中的表格：

 <form name = "my_form" enctype="multipart/form-data"  method = "POST" action = "skripta.php">
<div class="form-group row  ">
            <div class="col-md-6">
              <span id="porukaTitle" class="bojaPoruke"></span> 
                <label  for="naslov">Naslov</label>
            <input  type="text"  name="naslov" class="form-control" id="naslov">
            </div>
 <div class="form-group row ">
                <div class="col-md-1">
                    <input  type="submit" name="submit" value="Ucitaj"  id="submit"/>
                </div>
</form>

但是我在浏览器控制台中收到此错误：

当我按下提交按钮时，页面会转到 skripta.php，我会在其中显示带有 php 的页面。我正在使用 xampp！

Answer 1

在body标签末尾添加 javascript 验证脚本

并且还使用onload类的

$(document).ready(function() {
    $("#submit").click(function(e){
        e.preventDefault();
        // validation code here
        // if validation is successful
        $("form").submit(); // Submit the form
    })
});

您已经在头部添加了脚本，它实际上应该在页面加载结束时添加，当您选择的元素加载到 DOM 中时。

此外，您还将表单发布到 php 页面，因此当您提交页面时，它将重定向到其他页面，并且您的 javascript onSubmit将永远不会被调用相反，您可以做的是添加onClick function 就像我解释的那样，并在里面做你的验证部分和验证所有数据后，您可以调用submit()将页面路由到 php 文件。