layui 自定義表單驗證的幾個實例
阿新 • • 發佈:2019-03-22
manage ror ida div nbsp ace pla for trim
*註:使用本方法請先引入layui依賴的layu.js和layui.css
1.html
<input type="text" name="costbudget" lay-verify="required|validateMoney" placeholder="請輸入" autocomplete="off" class="layui-input">
2.js文件
<script type="text/javascript"> layui.use(‘form‘, function () { var form = layui.form;//自定義表單驗證(金額) form.verify({ validateMoney: [ /^[+]{0,1}(\d+)$/ //正則表達式 ,‘金額只能為正整數‘ //提示信息 ] }); //自定義表單驗證(地址鏈接) form.verify({ address: [ /^((ht|f)tps?):\/\/[\w\-]+(\.[\w\-]+)+([\w\-\.,@?^=%&:\/~\+#]*[\w\-\@?^=%&\/~\+#])?$/ ,‘請輸入正確的地址鏈接,如:https://www.baidu.com/‘ ] });</script>
3.自定義函數驗證
(1).帶請求的函數判斷: 比如驗證名稱是否重復
form.verify({ ‘unique‘ : function(value, item) { var checkValue = value.trim(); var checkResult=‘‘; $.ajax({ url : ‘/bomManage/checkBomCode‘, type :‘POST‘, data : { "newBomCode" : checkValue }, datatype : ‘json‘, async : false, success : function(result) { if (!result) { checkResult=‘BOM編號重復‘ } }, error : function() { kok.message("BOM編號驗證失敗") } }); return checkResult } })
(2).普通函數驗證
form.verify({ validateMoney: function (value) { var result = validateMoney(value); if (result != "Y") { return result; } } }); function validateMoney(money) { var reg = /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/; if (reg.test(money)) { return "Y"; } return "請輸入正確的金額,且最多兩位小數!"; }
layui 自定義表單驗證的幾個實例