html判断表单是否为空,layui判断表单是否为空

本文介绍了如何利用HTML表单的onsubmit事件,通过JavaScript回调函数实现在提交前自动检查并提示输入空白字段。作者分享了checkInput函数的实现细节,展示了如何提升用户体验和数据准确性。
摘要由CSDN通过智能技术生成

a770f24d4b1f7025326dd7be8284e2f2.png

表单不能为空提交提醒:

在做一个管理员系统的时候,有一个和后台对接的问题,就是前端表单提交过去的数据不能存在空白的字段。当时解决的方式是,使用原生js来进行DOM的操作,从而进行判断,弹框的操作。

之后,在浏览社区的时候,发现,表单有一个事件onSubmit ,这个事件,可以理解为在表单提交前一刻会进行触发,这时候,我们可以给这个事件传递一个回调函数,并且在回调函数中,进行是否存在空白表单的验证代码,以及提醒的代码。

Document

//表单在进行提交的前一刻会调用onsubmit事件,这个事件会接受checkInput这个函数的返回值。

function checkInput(form) {

for (let i = 0; i < form.length; i++) {

alert("进来了");

if (form.elements[i].value == "") {

alert("请您输入" + form.elements[i].placeholder);

form.elements.onfocus();

//这里返回一个Boolean值,从而确定表单是否能够提交

return false;

}

}

}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值