微信小程序禁止多次点击跳转、提交

在日常应用中,经常会有因为用户多次点击,从而造成界面BUG。以下是解决办法:

以view举例:

1、WXML:

<view class="btnfont canvas-btn" bindtap="{{!buttonClicked?'getLottery':''}}"> 
  抽 奖
</view> 

2、最好在util.js中封装一个函数,这样可以全局调用

function buttonClicked(self){  
  self.setData({
     buttonClicked: true
  })
  setTimeout(function () {    
    self.setData({
      buttonClicked: false
    })
  },4000)
}

不要忘记,把函数加入模型

3、在需要的界面的JS 中进行调用:

 data: {

    buttonClicked: false
  },
 getLottery:function(){
    
    util.buttonClicked(this);

 },

这样就可以使用啦

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
要编写一个包含表单并提交跳转微信小程序,可以使用以下步骤: 1. 在 WXML 文件中创建一个包含表单的页面。 例如,可以使用 `<form>` 标签来创建一个包含输入字段和提交按钮的表单,如下所示: ```html <form bindsubmit="onFormSubmit"> <input type="text" name="username" placeholder="用户名" /> <input type="password" name="password" placeholder="密码" /> <button type="submit">提交</button> </form> ``` 2. 在 JS 文件中编写表单提交处理程序。 当用户点击提交按钮时,可以调用 `bindsubmit` 属性指定的处理程序,并通过 `wx.request()` 函数将表单数据发送到服务器。在请求完成后,可以通过 `wx.navigateTo()` 函数跳转到下一个页面。 例如,可以编写以下处理程序: ```javascript Page({ onFormSubmit: function (event) { wx.request({ url: 'https://example.com/login', data: event.detail.value, method: 'POST', success: function () { wx.navigateTo({ url: '/pages/home/home', }) }, fail: function () { wx.showToast({ title: '登录失败,请重试', icon: 'none', }) }, }) }, }) ``` 3. 在 app.json 文件中注册下一个页面。 在跳转到下一个页面之前,需要在 `app.json` 文件中注册该页面。例如,可以添加以下代码: ```json { "pages": [ "pages/index/index", "pages/home/home" ], "window": { "navigationBarTitleText": "微信小程序" } } ``` 这将使页面 `/pages/home/home` 可以在小程序中被访问。 以上就是编写一个包含表单并提交跳转微信小程序的步骤。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值