脚本宝典收集整理的这篇文章主要介绍了微信小程序获取无限量formId的方法,脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
1.微信小程序获取多个formId的方法(解决小程序点击一次,提交多个表单问题)
利用点击穿透的原理,直接上代码吧
wXMl代码:
<!-- 1 -->
<form bindsubmit="formSubmit" report-submit="{{true}}">
<!-- 2 -->
<button formType="submit" class='BTn'>
<form bindsubmit="formSubmit" report-submit="{{true}}">
<button formType="submit" class='btn'>
<!-- 3 -->
<form bindsubmit="formSubmit" report-submit="{{true}}">
<button formType="submit" class='btn'>
<!-- 4 -->
<form bindsubmit="formSubmit" report-submit="{{true}}">
<button formType="submit" class='btn'>
<view class='u-publish-btn' bindtap='test'>发布</view>
</button>
</form>
</button>
</form>
</button>
</form>
</button>
</form>
wxss代码
form button{
padding: 0;
}
form button::after{
content: '';
display: none;
}
.u-publish-btn{
position: fixed;
bottom: 50rpx;
left: 50%;
transform: translatex(-50%);
width: 698rpx;
line-height: 90rpx;
border-radius: 4rpx;
background: #1a1a1a;
font-size: 38rpx;
font-weight: bolder;
color: #fff;
}
js代码:
formSubmit: function (e) {
if (e.detail.formId != 'the formId is a mock one') {
this.setData({
formIdString: e.detail.formId + "," + this.data.formIdString
})
}
console.LOG(e.detail, this.data.formIdString)
}
显示页面:
点击按钮后最终结果:
以上是脚本宝典为你收集整理的微信小程序获取无限量formId的方法全部内容,希望文章能够帮你解决微信小程序获取无限量formId的方法所遇到的问题。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。