小程序输入框文字上移问题-文字弹出输入框

45次阅读

共计 642 个字符,预计需要花费 2 分钟才能阅读完成。

输入框文字上移问题

wxlm

<input autoFocus="true" bindconfirm="confirmSearch" bindinput="search" class="srch-ipt" confirmType="search" placeholder="搜索内容" placeholderClass="ipt-placeholder" type="text" value=""></input>

wxss

.srch-ipt {
  /* prettier-ignore */
  height: 32PX;
  text-align: left;
  /* prettier-ignore */
  font-size: 15PX;
}

.ipt-placeholder {
  /* prettier-ignore */
  font-size: 15PX;
  color: #bebebe;
  text-align: left;
}

.lxy-nav-bar-search__input {flex: 1;}

上方代码可以完美解决 ios 文字上移问题,对于 Android 会降低偏移大小,因为此问题是微信原生组件所带来的,所以此套方案较为合适

Android 机子文字弹出输入框

  • 在 Android 机子会出现文字被键盘弹起顶出 input 框,解决方案为页面设置一个死的高度不要高于 windowHeight,最好是设置一个固定高度或者动态计算高度赋值

小程序自定义导航栏(完美适配所有手机)

  • Taro 组件 gitHub 地址详细用法请参考 README
  • 原生组件 gitHub 地址详细用法请参考 README

正文完
 0