收藏
回答

微信小程序input后在苹果机上bug点击空白处内容不显示

问题模块
API和组件

微信小程序input输入的内容,在苹果机上为什么失去焦点后,内容就消失了,但内容实际还在,只是看不到了,再点击一下就又出现了,为什么

最后一次编辑于  2017-12-13  (未经腾讯允许,不得转载)
回答关注问题邀请回答
收藏

6 个回答

  • June
    June
    2017-12-13

    这确实是一个bug,由fixed定位引起的,我们后面会尝试修复。


    目前要解决的话,可尝试将signbox或gr_bg其中一个view的定位改成绝对定位即可。


    2017-12-13
    赞同
    回复
  • June
    June
    2017-12-13

    你好,请提供一下能复现问题的简单代码示例。

    2017-12-13
    赞同
    回复
  • 见贤思齐
    见贤思齐
    2018-01-03

    我也遇到了同样的问题,但是我没有启用绝对定位或者固定定位。

    只有ios下才出现这个情况,安卓手机下没问题

    2018-01-03
    赞同
    回复
  •  懿洣  陽光 
     懿洣 陽光 
    2017-12-13

    好了,谢谢

    2017-12-13
    赞同
    回复
  •  懿洣  陽光 
     懿洣 陽光 
    2017-12-13

    这是代码,请看一下

    2017-12-13
    赞同
    回复
  •  懿洣  陽光 
     懿洣 陽光 
    2017-12-13
    <!--pages/login/jg_login/jg_login.wxml-->
     
    <view class="signbox" >
    <view class="container gr_login">
    <!--logo-->
    <view bindtap="bindViewTap" class="Sign_hd">
    <image class="Sign_logo" src="/images/logo.png"></image>
    </view>
    <!--<view class="test" >
    token:{{logs}}
    </view>-->
    <view class="gr_bg" style="background-image:url({{imgurl}}bg.png)"></view>
    <view class="qwjg" bindtap="onItemClick" style="background-image:url({{imgurl}}qwjg.png);" >前往个人</view>
    <view class="login-from">
    <!--证件类型-->
    <view class="input_all">
    <view class="inputView" bindtap="clickselect">
    <view class="gr_text" style="background-image:url({{imgurl}}zjlx.png);"></view>
    <view class="jg_zjlx">{{firstPerson}}</view>
    <view class="down" style="background-image:url({{imgurl}}down.png);" ></view>
    </view>
    <view class="jg_select" style="z-index:{{index}}">
    <view class="phone_select" hidden="{{selectPerson}}" >
    <view class="jg_option" bindtap="myselect" data-me="1" data-text="营业执照">营业执照</view>
    <view class="jg_option" bindtap="myselect" data-me="7" data-text="基金会">基金会</view>
    </view>
    </view>
    </view>
    <!--证件号-->
    <view class="inputView" >
    <view class="gr_text" style="background-image:url({{imgurl}}gr_text.png); "></view>
    <input class="inputText" placeholder-style="color:#ccc;" placeholder="证件号码" bindinput="accoInput" />
    </view>
    <view class="line"></view>
    <!--密码-->
    <view class="inputView">
    <view class="gr_text" style="background-image:url({{imgurl}}gr_pw.png); "></view>
    <input class="inputText" placeholder-style="color:#ccc;" password="true" placeholder="请输入密码" bindinput="passwordInput" />
    </view>
    <!--按钮-->
    <view class="loginBtnView">
    <button class="loginBtn" size="{{primarySize}}" loading="{{loading}}" plain="{{plain}}" disabled="{{disabled}}" bindtap="login">登录</button>
    </view>
    </view>
     
    </view>
    </view>
     
     
     
     
    /* pages/login/jg_login/jg_login.wxss */
    .gr_login .Sign_hd{
      display: flex;
      flex-direction: column;
      align-items: center;
    }
     
    .gr_login .Sign_logo {
      width: 215rpx;
      height: 250rpx;
      margin: 50rpx;
    }
    .signbox
    {
      width: 100%;
      height: 100%;
      position: fixed;
      background-color: #ff665d;
      border-top: 2px solid #3e95fe;
    }
    .qwjg{
      width: 220rpx;
      height: 75rpx;
      padding-left: 40rpx;
      box-sizing: border-box;
      line-height: 75rpx;
      background-size: 100%;
      color: #fff;
      font-size: 30rpx;
      position: fixed;
      top: 27%;
      left: 0;
    }
    .gr_bg{
      width: 750rpx;
      height: 669rpx;
      background-size: 100%;
      position: fixed;
      bottom: 0rpx;
      z-index: -1;
    }
    .login-from {
     flex: auto;
     margin: 0 auto;
     margin-top:10%;
     height:650rpx;
     width: 100%;
     padding:0 5%;
     box-sizing: border-box;
    }
    .inputView {
     border: 1px solid #fff;
     line-height: 44px;
     border-radius:10rpx;
     width:100%;
     height:74rpx;
     margin-top:30rpx;
     display: flex;
     
    }
    .jg_zjlx{
      color: #fff;
      font-size: 24rpx;
      flex: 1;
    }
     
    .jg_select{
      width:100%;
      line-height:74rpx;
      color: #5f5f5f;
      font-size: 24rpx;
      box-sizing: border-box;
      z-index:0;
    }
     
    .jg_option{
       border-bottom: 1px solid #ccc;
     
       background-color:#fff;
      padding: 0 90rpx;
      height: 74rpx;
    }
    .no_br{
      border:0px;
    }
    .gr_text{
      width:90rpx;
      height: 74rpx;
      background-size: 100%;
      float: left
    }
     
    .inputText{
      flex: block;
      float: left;
      text-align: left;
      color: #fff;
      font-size: 24rpx;
      height:74rpx;
      width:86%;
    }
     
    .loginBtnView {
     width: 100%;
     height: auto;
     margin-top: 0px;
     margin-bottom: 0px;
     padding-bottom: 0px;
     
    }
     
    .loginBtn {
     width: 100%;
     background-color: #fff;
     color: #ff665d;
     font-size:47rpx;
     height: 95rpx;
     line-height: 95rpx;
     margin-top:70rpx;
    }
     
    .test {
      color: #fff;
      margin-top: 20px;
      background-color: #f00;
      height: 30px;
      width: 80%;
    }
    .down{
      width: 40rpx;
      height: 68rpx;
      float: right;
      margin-right: 20rpx;
      background-size: 80%;
      background-repeat: no-repeat;
      margin-top: 10rpx;
    }
     
     
    /* pages/login/jg_login/jg_login.js */
    Page({
      data: {
        list: [
          {
            id: 'view',
            name: '视图容器',
            open: false,
            pages: ['view', 'scroll-view', 'swiper']
          }, ],
        index: -999,
        selectPerson: true,
        firstPerson: '我可以点击',
      },
     
     
      //点击选择类型
      clickselect: function () {
        var selectPerson = this.data.selectPerson;
        if (selectPerson == true) {
          this.setData({
            selectArea: true,
            selectPerson: false,
            index: 999
          })
        } else {
          this.setData({
            selectArea: false,
            selectPerson: true,
            index: -999
          })
        }
      },
       
    })


    2017-12-13
    赞同
    回复