小程序
小游戏
企业微信
微信支付
扫描小程序码分享
iOS15 input 会有触摸点击穿透问题
3 个评论
加粗
标红
插入代码
插入链接
插入图片
上传视频
input可通过page.json的globalStyle配置"renderingMode": "seperated"防止穿透;
但是textarea不行;可以像一楼这样用view代替textarea的显示但是还要改样式啊很麻烦,所以用一个textarea标签就行了 disabled="true";完美解决
你好,麻烦通过点击下方“反馈信息”按钮,提供出现问题的。
目前自己的解决方案是默认使用view代替input的显示,在点击时切换成input。
<view v-if="!focused" @click="dofocus" style="background:rgba(1,1,1,0);width: 100%;z-index: 3;flex: 1;min-height: 70rpx;"> <text style="color: #ccc;font-size: 28rpx;line-height: 70rpx;" v-if="!defaultValue">{{placeholder}}</text> <text style="color: #333;font-size: 28rpx;line-height: 70rpx;" v-else>{{defaultValue}}</text> <input v-else id="m_input" class="u-input__input" :type="type == 'password' ? 'text' : type" :style="[getStyle]" :value="defaultValue" :password="type == 'password' && !showPassword" :placeholder="placeholder" :placeholderStyle="placeholderStyle" :disabled="disabled || type === 'select'" :maxlength="inputMaxlength" :focus="focused" :confirmType="confirmType" :cursor-spacing="getCursorSpacing" :selection-end="uSelectionEnd" :selection-start="uSelectionStart" :show-confirm-bar="showConfirmbar" @focus="onFocus" @blur="handleBlur" @input="handleInput" @confirm="onConfirm" /> dofocus(){ this.focused=false; setTimeout(()=>{ this.focused=true },100) } handleBlur(event) { setTimeout(() => { this.focused = false; }, 100) },
关注后,可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
input可通过page.json的globalStyle配置"renderingMode": "seperated"防止穿透;
但是textarea不行;可以像一楼这样用view代替textarea的显示但是还要改样式啊很麻烦,所以用一个textarea标签就行了 disabled="true";完美解决
目前自己的解决方案是默认使用view代替input的显示,在点击时切换成input。
<view v-if="!focused" @click="dofocus" style="background:rgba(1,1,1,0);width: 100%;z-index: 3;flex: 1;min-height: 70rpx;"> <text style="color: #ccc;font-size: 28rpx;line-height: 70rpx;" v-if="!defaultValue">{{placeholder}}</text> <text style="color: #333;font-size: 28rpx;line-height: 70rpx;" v-else>{{defaultValue}}</text> <input v-else id="m_input" class="u-input__input" :type="type == 'password' ? 'text' : type" :style="[getStyle]" :value="defaultValue" :password="type == 'password' && !showPassword" :placeholder="placeholder" :placeholderStyle="placeholderStyle" :disabled="disabled || type === 'select'" :maxlength="inputMaxlength" :focus="focused" :confirmType="confirmType" :cursor-spacing="getCursorSpacing" :selection-end="uSelectionEnd" :selection-start="uSelectionStart" :show-confirm-bar="showConfirmbar" @focus="onFocus" @blur="handleBlur" @input="handleInput" @confirm="onConfirm" /> dofocus(){ this.focused=false; setTimeout(()=>{ this.focused=true },100) } handleBlur(event) { setTimeout(() => { this.focused = false; }, 100) },