小程序中点击input控件键盘弹出时placeholder文字上移

2022-11-18,,,,

  最近做的一个小程序项目中,出现了点击input控件键盘弹出时placeholder文字上移,刚开始以为是软键盘弹出布局上移问题是传说中典型的fixed 软键盘顶起问题,因此采纳了网上搜到的“当获取焦点时,将fixed的元素改为static;失去焦点,再改回fixed”的方法,然而行不通,我试着给input加了个边框,然而当软键盘弹出时input框并没有移动,仅仅是input中的placeholder上移了,因此只能想到了让placeholder文字在聚焦是为空,在失焦是显示为指定值一下为具体代码

xml
<input id='searchInput' placeholder='{{phValue}}' type="text"  bindfocus='onFocus' bindblur='onBlur'/>
 
js

Page({
// 页面的初始数据
data: {
phValue:"请输入要录入的单词"
},
onFocus: function (e) {
this.setData({
phValue:" "
})
},
onBlur: function (e) {
this.setData({
phValue: "请输入要录入的单词"
})
}
})

小程序中点击input控件键盘弹出时placeholder文字上移的相关教程结束。

《小程序中点击input控件键盘弹出时placeholder文字上移.doc》

下载本文的Word格式文档,以方便收藏与打印。