小程序
小游戏
企业微信
微信支付
扫描小程序码分享
目前做的一个功能,输入框输入数字,失去焦点后数字要进行格式化,输入框后面有清除输入框数据的按钮,在输入数字后,让输入框不失去焦点,点击后面清除按钮,在开发工具中执行顺序为:输入框blur事件————>>>清除按钮的tap事件;但在手机上执行顺序:清除按钮的tap事件————>>>>>输入框blur事件。开发工具上体验正常,手机上体验差,想要的功能出不来。
开发工具执行顺序:
手机执行顺序:
4 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
真机和开发者工具的机制不一样,触发的顺序不一样,不能依赖事件的顺序做逻辑
建议setTimeout延后执行清除的逻辑~
你好,麻烦通过点击下方“反馈信息”按钮,提供出现问题的。
wechatide://minicode/Pb7wuhm765Zc 代码片段链接
<
view
class
=
'flex my-box'
>
'flex-1'
input
type
'digit'
value
'{{changeValue}}'
bindblur
"changeFmt"
placeholder
'请输入数字'
></
</
style
'color:blue'
bindtap
'clearInput'
>清除</
.flex {
display
: -webkit-flex;
: flex;
}
.flex
-1
{
flex:
1
;
.my-box{
border-top
:
1px
solid
#d8d8d8
border-bottom
padding
30
rpx;
const app = getApp()
Page({
data: {
changeValue:
''
,
},
onLoad:
function
() {
changeFmt:
(e){
console.log(
"失去焦点"
);
this
.setData({
changeValue:666
})
"失去焦点重设输入框的值:"
+
.data.changeValue);
clearInput:
(){
"清除方法"
"清除输入框的值:"
麻烦给个相关的代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html),我们定位下问题
关注后,可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
真机和开发者工具的机制不一样,触发的顺序不一样,不能依赖事件的顺序做逻辑
建议setTimeout延后执行清除的逻辑~
wechatide://minicode/Pb7wuhm765Zc 代码片段链接
<
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
:
30
rpx;
}
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);
}
})
麻烦给个相关的代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html),我们定位下问题