使用layer弹窗提交表单时判断表单是否输入为空的例子
2020-02-13 11:32
561 查看
获得 layer 文件包后,解压并将 layer 整个文件夹(不要拆分结构) 存放到你项目的任意目录,使用时,只需引入 layer.js 即可
使用时一定他要先引入jq1.8,或者以上版本!!!
下面是提交表单的实列
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" /> <title></title> <script src="__STATIC__/js/mui.min.js"></script> <link href="__STATIC__/css/mui.min.css" rel="external nofollow" rel="stylesheet"/> <script src="__STATIC__/layer/jquery-2.2.4.min.js"></script> <script src="__STATIC__/layer/layer.js"></script> <script type="text/javascript" charset="utf-8"> mui.init(); </script> </head> <body> <center> <ul class="mui-table-view"> <li class="mui-table-view-cell">商品入库</li> </ul> </center> <form action="{:url('order')}" method="post" class="mui-input-group"> <div class="mui-input-row"> <label>商品单号:</label> <input type="text" class="mui-input-clear" placeholder=" 请输入用户名" name="order" id="order"> </div> <div class="mui-input-row"> <label>商品名称:</label> <input type="text" class="mui-input-clear" placeholder=" 请输入用户名" name="name" id="name"> </div> <div class="mui-input-row"> <label>商品单价:</label> <input type="text" class="mui-input-clear" placeholder=" 请输入用户名" name="money" id="money"> </div> <div class="mui-input-row"> <label>商品库存:</label> <input type="text" class="mui-input-clear" placeholder=" 请输入用户名" name="stock" id="stock"> </div> <div class="mui-input-row"> <label>商品备注:</label> <input type="text" class="mui-input-clear" placeholder=" 请输入密码" name="remarks" id="remarks"> </div> <div class="mui-button-row"> <button type="submit" class="mui-btn mui-btn-primary" id="cx">确认</button> </div> </form> <script type="text/javascript"> $(document).ready(function(){ $('#cx').click(function(){ var $1 = $.trim($('#order').val()); var $2 = $.trim($("#name").val()); var $3 = $.trim($("#money").val()); var $4 = $.trim($("#stock").val()); var $5 = $.trim($("#remarks").val()); if($1 == ''){ layer.msg('商品单号不能为空',function() {time:2000}); return false; } if($2 == ''){ layer.msg('请输入商品名称!',function() {time:2000}); return false; } if($3 == ''){ layer.msg('请输入商品单价!',function() {time:2000}); return false; } if($4 == ''){ layer.msg('请输入商品库存!',function() {time:2000}); return false; } }); }); </script> </body> </html>
以上这篇使用layer弹窗提交表单时判断表单是否输入为空的例子就是小编分享给大家的全部内容了,希望能给大家一个参考
您可能感兴趣的文章:
相关文章推荐
- js replace 全局替换 以表单的方式提交参数 判断是否为ie浏览器 将jquery.qqFace.js表情转换成微信的字符码 手机端省市区联动 新字体引用本地运行可以获得,放到服务器上报404 C#提取html中的汉字 MVC几种找不到资源的解决方式 使用Windows服务定时去执行一个方法的三种方式
- 前端js——表单提交时间,焦点获得失去事件、判断输入内容是否正确、内容错误阻止表单提交
- Js 中关于注册表单,使用onsubmit进行拦截提交,并判断用户填写的内容是否正确
- 表单提交时js页面不刷新判断输入是否为空
- 在javaScript中使用正则表达试判断输入是否是float类型
- HttpClient 4 使用POST方式提交普通表单数据的例子
- ajax鼠标输入时立即判断文本框值是否存在,存在则提示并阻止提交。
- //例子5.4 输入一个字符,判断它是否大写字母,如果是,将它转换成小写字母;
- 使用try catch判断是否输入为数字
- 关于使用javascript设置,读取,判断表单的小例子
- js获得form表单的值$('#form1').serializeObject()/serialize()/serializeArray对比及判断表单中是否有输入框未输入值
- shell脚本使用两个数组,判断一个变量是否在数组里面的例子
- JS判断表单输入是否为空
- js判断表单输入是否为空
- 表单提交前,判断webuploader是否上传
- PHP中如何判断FROM表单提交的数字是否为整数?
- php 提交表单 关闭layer弹窗iframe的实例讲解
- JS判断表单输入是否为空(示例代码)
- 如何判断标准输入或输出是否经过了重定向,即是否在命令行上使用了“”?
- 实验9-2 //编程判断输入的一串字符是否为“回文”。所谓“回文”,是指顺读和倒读都一样的字符串。如“XYZYX”和“xyzzyx”都是“回文”。要求使用指针变量判断字符串是否是回文。