收藏
回答

输入框blur事件和标签tap事件执行顺序在开发工具和手机上不一样

框架类型 问题类型 操作系统 操作系统版本 手机型号 微信版本
小程序 Bug ios 11.3.1 android 4.4.4 iphone 6s oppo r7s 6.6.6

目前做的一个功能,输入框输入数字,失去焦点后数字要进行格式化,输入框后面有清除输入框数据的按钮,在输入数字后,让输入框不失去焦点,点击后面清除按钮,在开发工具中执行顺序为:输入框blur事件————>>>清除按钮的tap事件;但在手机上执行顺序:清除按钮的tap事件————>>>>>输入框blur事件。开发工具上体验正常,手机上体验差,想要的功能出不来。

开发工具执行顺序:

手机执行顺序:

回答关注问题邀请回答
收藏

4 个回答

  • 视频号小店技术助手 - cunjin
    视频号小店技术助手 - cunjin
    2018-05-11

    真机和开发者工具的机制不一样,触发的顺序不一样,不能依赖事件的顺序做逻辑

    建议setTimeout延后执行清除的逻辑~

    2018-05-11
    有用
    回复
  • 端
    2018-05-09

    wechatide://minicode/Pb7wuhm765Zc 代码片段链接

    2018-05-09
    有用
    回复
  • 端
    2018-05-09
    <view class='flex my-box'>
      <view class='flex-1'>
        <input type='digit' value='{{changeValue}}' bindblur="changeFmt" placeholder='请输入数字'></input>
      </view>
      <view style='color:blue' bindtap='clearInput'>清除</view>
    </view>
    .flex {
      display: -webkit-flex;
      display: flex;
    }
     
    .flex-1 {
      flex: 1;
    }
    .my-box{
      border-top: 1px solid #d8d8d8;
      border-bottom: 1px solid #d8d8d8;
      padding: 30rpx;
    }
    const app = getApp()
     
    Page({
      data: {
        changeValue:'',
      },
      onLoad: function () {
        
      },
      changeFmt:function(e){
        console.log("失去焦点");
        this.setData({
          changeValue:666
        })
        console.log("失去焦点重设输入框的值:"+this.data.changeValue);
      },
      clearInput:function(){
        console.log("清除方法");
        this.setData({
          changeValue: ''
        })
        console.log("清除输入框的值:" +this.data.changeValue);
     
      }
    })


    2018-05-09
    有用
    回复
  • 疯狂的小辣椒
    疯狂的小辣椒
    2018-05-08

    麻烦给个相关的代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html),我们定位下问题

    2018-05-08
    有用
    回复
登录 后发表内容