Question

我编写了一个HTML表单和脚本来验证表单。问题在于，每当我提交表单时，我都会被重定向到一个页面，告诉我＆＃34;找不到您的文件＆＃34;。

我是否有特定的方法来调用脚本？或者我可以强制它在没有重定向的情况下运行吗？

<form id="bioform" action="/action_page.php">
  <label>Biography</label><br>
  <textarea placeholder="Enter bio here" name="bio" rows="10" cols="50"></textarea><br><br>
  <label>Update Biography Picture</label><br><br>
  <input type="file" name="bioimage"><br><br>
  <button type="submit" onclick="function()">Update</button><br>
</form>

<script>
  $(document).ready(function () {
    $('#bioform').validate({
        rules: {
          bio {
            required: true,
            minlength: 5,
          },
        }
        messages: {
          bio {
            required: 'Please enter a biography.',
            minlength: 'Please enter a valid biography.',
          },
        }
        });
  });
</script>

Answer 1

添加enctype =“multipart / form-data”以形成标记

    <form id="bioform" action="/action_page.php" enctype="multipart/form-data">
     <label>Biography</label><br>
     <textarea placeholder="Enter bio here" name="bio" rows="10" cols="50">
     </textarea><br><br>
     <label>Update Biography Picture</label><br><br>
     <input type="file" name="bioimage"><br><br>
     <button type="submit" onclick="function()">Update</button><br>
    </form>

Answer 2

指定发送到必要的位置时是正斜杠吗？例如：

<form id="bioform" action="/action_page.php">

应替换为：

<form id="bioform" action="action_page.php">

Answer 3

由于您正在使用jQuery，请尝试使用：

e.preventDefault()

e.preventDefault()方法停止了默认操作发生的因素。例如：阻止提交按钮提交表格。阻止链接跟踪URL。

此外，由于您正在处理文件上传，因此您需要在method标记中添加<form>属性值POST以及enctype="multipart/form-data"。

转到这个小提琴并检查它是否适合您：https://jsfiddle.net/z0db4vq0/1/

如何使用HTML和jQuery进行表单验证而无需重定向到另一个页面？

3 个答案: