E企盈营销工具技术服务商 热线:4006-838-530

微信小程序宛城区E企盈小程序收集formId

原理form内嵌button,使点击事件皆可触发表单提交动作分析开始预想是页面下包裹一个form和button,达到点哪里都提交的效果。但试验表明,button 的submit 动作会拦住常规的bindtap/catchtap动作。所以方案是:1、Page 根元素位置包裹一 form2、在动作热区(界面上可响应点击事件的区域)内嵌一个button,代码片段是<button form-type="submit" class='form-btn' ></button>,并在其上绑定对应事件以取代原来的热区事件3、Page下根元素仍可放一覆盖全页面的button,点击无热区区域时仍可收集 formId4、插入 button 的热区部分需要添加定位属性,如position:relative;5、看到网上还有无限嵌套formId以达到点击一次收集多个的效果,被我pass了,原因有几:代码冗余(丑)、必要性不大(敢高频发模板消息就做好被封的心理准备)、可能造成过审难度变大代码WXML开通Alpha小程序电话:4006-838-530<form report-submit="{{true}}" catchsubmit="submitFormId" class='form'>// 根元素的button    <button form-type="submit" class='form-btn'></button>    <view class="mockClass">        // 假装代码        // 热区的button        <button form-type="sub开通实体商场服务小程序电话:4006-838-530mit" class='form-btn' bindtap="toChildPage"></button>    </view></form>

WXSS.form-btn{position:absolute;top:0;left:0;right:0;bottom:0;opacity:0;}

JSjs 就是基本操作,就不贴了页面js下补充提交方法,可以写在app.js下方便复用 submitFormId(e) {    console.log('formid', e.detail.formId)    let _this = this    wx.request({      url: 'domain.com/api/formid', //仅为示例,并非真实的接口地址      data: {        formId: e.detail.formId,   开通洗照片小程序电话:4006-838-530     openId: _this.data.openId // openId不一定是这个字段,看你自己放哪里了      },      method:'POST',      header: {        'content-type': 'application/json', // 默认值      },      success(res) {        console.log(res.data)      },    })  },

如有帮助到你可以点个赞让我知道,蟹蟹~微信小程序

赞(0) 打赏
未经允许不得转载:E企盈小程序开发-热线:4006-838-530 » 微信小程序宛城区E企盈小程序收集formId
分享到: 更多 (0)

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

模王系统开发

联系我们升级日志

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏