微信小程序如何实现表单验证form提交错误
不懂微信小程序实现表单验证form提交错误的方法?其实想解决这个问题也不难,下面让小编带着大家一起学习怎么去解决,希望大家阅读完这篇文章后大所收获。
创新互联建站服务项目包括西华网站建设、西华网站制作、西华网页制作以及西华网络营销策划等。多年来,我们专注于互联网行业,利用自身积累的技术优势、行业经验、深度合作伙伴关系等,向广大中小型企业、政府机构等提供互联网行业的解决方案,西华网站推广取得了明显的社会效益与经济效益。目前,我们服务的客户以成都为中心已经辐射到西华省份的部分城市,未来相信会继续扩大服务区域并继续获得客户的支持与信任!
表单验证,点击确认发布不能为空错误提示。
以下是效果图:

代码如下:
WXML:
{{popErrorMsg}}
WXSS:
page{background: #f4f4f4;}
.ad_popHd{height: 76rpx; line-height: 76rpx; font-size: 32rpx;text-align: center; border-bottom: 1px solid #cdd1cd; padding: 0 20rpx;color: #202120;}
.ad_popFt{ margin: 20rpx ; margin-top: 50rpx;}
.ad_popArea{ width: 708rpx; height:400rpx;font-size:30rpx;padding: 20rpx; box-sizing: border-box; -webkit-box-sizing: border-box; line-height: 40rpx; color: #333; background: #fff; }
.ad_popCout{ color: #969899; font-size: 24rpx; text-align: right; line-height: 58rpx; padding: 0 20rpx;}
.informBtn{background: #09bb07;color: #fff;font-size: 34rpx; margin-top: 38rpx;height: 88rpx;}
.one_stars{color: #999;}
.one_star{font-size: 20rpx;color: #999;}
.danger{ color: #f64400;}
.ad_popError{ background: #de352d; color: #fff; height: 58rpx; line-height: 58rpx; font-size: 24rpx; text-align: center; position: absolute; left: 0; top: 0; width: 100%; z-index:3;}JS:
// pages/informLeaveMsg/informLeaveMsg.js
Page({
/**
* 页面的初始数据
*/
data: {
},
//确认发布
goDetail:function(e){
setTimeout(()=>{
var subValue = e.detail.value.textarea
console.log(subValue)
if (subValue == null || subValue == "") {
console.log("不能为空")
this.setData(
{ popErrorMsg: "发布的留言内容不能为空" }
);
this.ohShitfadeOut();
return;
}
},100)
},
//定时器提示框3秒消失
ohShitfadeOut() {
var fadeOutTimeout = setTimeout(() => {
this.setData({ popErrorMsg: '' });
clearTimeout(fadeOutTimeout);
}, 3000);
},
})感谢你能够认真阅读完这篇文章,希望小编分享微信小程序实现表单验证form提交错误的方法内容对大家有帮助,同时也希望大家多多支持创新互联,关注创新互联行业资讯频道,遇到问题就找创新互联,详细的解决方法等着你来学习!
网站名称:微信小程序如何实现表单验证form提交错误
浏览地址:http://www.jxjierui.cn/article/jjhojd.html


咨询
建站咨询
