快盘下载:好资源、好软件、快快下载吧!

快盘排行|快盘最新

当前位置:首页软件教程电脑软件教程 → JS阻止表单submit提交(在提交之前做验证及判断)

JS阻止表单submit提交(在提交之前做验证及判断)

时间:2022-09-15 19:15:19人气:作者:快盘下载我要评论

在工作中遇到表单提交之前,需要验证用户输入的是否为空,之前使用ajax做提交,在js里面直接做判断,如果用户输入为空则弹出提示框(起初默认是隐藏的,非alert弹出框),让用户重新输入,当输入框获取焦点的时候,弹出的提示框隐藏。

1.原理:onsubmit 函数名()

在表单的标签里面加入 onsubmit标签

在form中加上:

<form  method="post"onsubmit="return checkip()">

正文代码:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
<form  method="post"onsubmit="return checkip()">
            <label class='lab' for="exampleInputName2">start_time</label>
            <input type="datetime-local" class="form-control startTimewater" id="exampleInputName2" name="start_time">

            <label  class='lab' for="exampleInputEmail2">end_time</label>
            <input type="datetime-local" class="form-control endTimewater" id="exampleInputEmail2" name="end_time">
            <button type="submit" class="btn btn-info btn-search" id="submit">提交</button> 
    </form>

<script src="jquery-1.12.4.min.js"></script>
<script type="text/javascript">
 function checkip() {
        var start_time_water = $('#exampleInputName2').val()
        var end_time_water = $('#exampleInputEmail2').val()
        if (start_time_water=="" || end_time_water==""){
            alert('请输入正确的格式,时间不能为空!')
            return false;
        }
        else{
            return true;   
        }
    }
</script>
</html>

return false :表单不提交;return true;表单提交。在return false 做操作,判断,条件满足则提交,条件不满足,不提交。

在用户提交空的时候,会弹出提示框。

参考文章:

阻止表单submit提交(在提交之前做验证及判断)

https://blog.csdn.net/weixin_40933787/article/details/80110207

相关文章

  • 全局配置和windows节点常用配置

    全局配置和windows节点常用配置,小程序根目录下的app.json文件是小程序的全局配置文件,常用的配置项如下: pages 记录当前小程序所有页面的存放路径 windows 全局设置小......
  • 2. 请画出NAT模式、DR模式的原理图并说出有什么区别

    2. 请画出NAT模式、DR模式的原理图并说出有什么区别,集群是一组相互独立的、通过高速网络互联的计算机,它们构成了一个组,并以单一系统的模式加以管理。...

网友评论

快盘下载暂未开通留言功能。

关于我们| 广告联络| 联系我们| 网站帮助| 免责声明| 软件发布

Copyright 2019-2029 【快快下载吧】 版权所有 快快下载吧 | 豫ICP备10006759号公安备案:41010502004165

声明: 快快下载吧上的所有软件和资料来源于互联网,仅供学习和研究使用,请测试后自行销毁,如有侵犯你版权的,请来信指出,本站将立即改正。