效果:

在点击提交按钮时,首先进行js判断, 如果不符合条件,则alert出提示信息,并return false.

主要点就在于给form表单添加一个onsubmit事件. 在onsubmit事件中定义的函数里进行js验证处理.

代码 :

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <link rel="stylesheet" href="/static/layui/css/layui.css">
    <script src="/static/layui/jquery.min.js"></script>
    <script src="/static/layui/layui.js"></script>
</head>
<body>
<div id="up_image">
    <form action="" method="post" enctype="multipart/form-data" οnsubmit="return verify()">
        <br>
        <br>
        <br>
        <p>请上传发票:  <input type="file" name="invo" value="" id="file"></p><br/><br />
        <p>快递单号: <input type="text" name="OrderNu" value="" id="OrderNu" /></p><br />
        <p>快递公司: <input type="text" name="Expre" value="" id="Expre"/></p><br />
        <input type="submit" value="提交" style="width: 140px;height:40;color:red;margin-top: 30px;margin-left: 130px;">
    </form>
</div>
</body>
</html>

<script type="text/javascript">
    function verify() {var file = $("#file").val();
        var order = $("#OrderNu").val();
        var Expre = $("#Expre").val();
        if (file == '' || file==null) {alert('请上传发票');
            return false;
        }if(order==''){alert('请补全快递单号');
            return false;
        }if(Expre==''){alert('请填写快递公司');
            return false;
        }}
</script>

提交Form表单,submit之前做js判断处理相关推荐

  1. Ajax提交form表单的内容,并判断是否提交成功,提交确认提示框,确认提交,取消,回退缓存的数据

    //保存按钮提交表单内容function submitForm(t) {//提交前把单选按钮选的值给上隐藏的hiddenvar VNeedRegister = $("input[name=' ...

  2. js实现Form表单submit提交截获数据(各浏览器通用)

    js实现Form表单submit提交截获数据(各浏览器通用) js实现Form表单submit提交截获数据(各浏览器通用) No Comments | js , 安全 , PHP | by calms ...

  3. js提交form表单

    [背景]     前段时间将边用边学javascript.pdf书看完了,其中之前最不熟悉的也是这次印象最深刻的就是提交form表单,所以在这里总结一下js提交form表单,以及表单中对应的一些扩展知 ...

  4. js 提交form表单,js更改form表单的action属性

    2019独角兽企业重金招聘Python工程师标准>>> js 提交form表单 <s:form id="formID1" action="favo ...

  5. html得到上传文件类型后缀,js获取上传文件后缀名(附js提交form表单)

    js获取上传文件后缀名(附js提交form表单) 代码如下: function check_file() { var strFileName=form1.FileName.value; if (str ...

  6. 使用js提交form表单的两种方法

    提交form表单的时候瑶族一些简单的验证,验证完后才能提交,避免无效提交. 1.当输入用户名和密码为空的时候,需要判断.这时候就用到了校验用户名和密码,这个需要在前端页面写:有两种方法,一种是用sub ...

  7. html表单调用js方法,使用js提交form表单的两种方法

    提交form表单的时候瑶族一些简单的验证,验证完后才能提交,避免无效提交. 1.当输入用户名和密码为空的时候,需要判断.这时候就用到了校验用户名和密码,这个需要在前端页面写:有两种方法,一种是用sub ...

  8. js异步提交form表单的解决方案

    1.定义异步提交表单的方法 (通用方法) /*** 异步提交form表单* @param options {form:form表单元素,success:执行成功后处理函数}* <span sty ...

  9. js提交form表单,并传递参数

    js如何提交form表单,并传递参数呢? 参考:https://www.itdaan.com/blog/2013/04/18/d26f13da9de5e2bbd607464da6ad1f8e.html

最新文章

  1. 逗比讲算法:什么是冒泡排序?
  2. 【每日一算法】杨辉三角到底是什么?
  3. Django(part42)--跨站请求伪造
  4. 【AI视野·今日CV 计算机视觉论文速览 第216期】Wed, 9 Jun 2021
  5. 多线程导出excel高并发_怎么理解分布式、高并发、多线程
  6. 干了三年的Java,你竟然还不会MySQL性能优化
  7. chrome浏览器隐藏地址栏_Chrome将隐藏地址栏的网址 这么做的原因是为了防止钓鱼网址...
  8. linux netfilter路由表,Linux netfilter 学习笔记 之十四 netfilter模块会修改数据包关联的路由缓存吗...
  9. 网络协议从入门到底层原理(3)网络互联模型、物理层、数据链路层(CSMA/CD协议、Ethernet V2帧、PPP协议)
  10. 平安京因服务器升级维护什么意思,阴阳师4月27日维护更新公告 堀江由衣猫掌柜降临平安京...
  11. 持久化存储系统本版号
  12. 罗马数字 java_java将罗马数字转换成整数算法详解-Fun言
  13. pip查看包的历史版本
  14. Java 中最简单打印数组的方式
  15. 【h5白鹭引擎】如何快速开发一个小游戏
  16. 赠书 | 年终盘点:超融合架构(HCI)的现状和前景; 中国HCI厂商列表; 全球有哪些HCI厂商?
  17. 导进去然后这边就报错了 看修改也看不懂
  18. 计算机网络协议——墙都不服,就服你系列
  19. 为什么听过很多道理,依然过不好这一生?
  20. python实现rar解压和压缩

热门文章

  1. 在Android应用中使用Pull解析XML文件(传智播客视频笔记)
  2. AsyncEx - async/await 的辅助库
  3. 一篇文章了解Liquid模版引擎
  4. 如何编译 dotnet/aspnetcore 源代码
  5. C#中的命名空间和程序集
  6. 轻松实现深度Clone | Source Generators方式
  7. Dapr + .NET Core实战(三)状态管理
  8. 持续20年,一场威胁Linux存亡的诉讼终结束
  9. .NET之模型绑定和验证
  10. 等待十年,史上第一个 64 位版 Visual Studio 将于今夏公开首个预览版!