使用layer彈窗提交表單時判斷表單是否輸入為空的例子
更新時間:2019年09月26日 10:40:27 作者:GEKLHP
今天小編就為大家分享一篇使用layer彈窗提交表單時判斷表單是否輸入為空的例子,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧
獲得 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彈窗提交表單時判斷表單是否輸入為空的例子就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關文章
純JavaScript實現(xiàn)獲取onclick、onchange等事件的值
這篇文章主要介紹了JavaScript獲取onclick、onchange等事件的值的方法,需要的朋友可以參考下2014-12-12Three.js利用Detector.js插件如何實現(xiàn)兼容性檢測詳解
這篇文章主要給大家介紹了關于Three.js利用Detector.js插件如何實現(xiàn)兼容性檢測的相關資料,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面來一起看看吧。2017-09-09