根据官方文档,textarea 是原生组件 (https://developers.weixin.qq.com/miniprogram/dev/component/textarea.html),所谓原生组件就是 “脱离在 WebView 渲染流程外”

文档中的原话是:

原生组件的级是最高的,所以页面中的其他组件无论设置 z-index 为多少,都无法在原生组件上。

页面中有弹窗弹出层时,点击弹出层时,底层的textarea也会显示出来,设置z-index没作用。

注意:请在真机中测试。微信开发者工具中看到这样的问题。

针对弹窗如何解决?

找了个笨方法,有弹窗的时候,就用 wx:if 把 textarea 藏起来,弹出层隐藏的时候再显示textarea。

微信小程序textarea层级过高(盖住其他元素)的更多相关文章

  1. 关于微信小程序textarea层级过高问题解决

    一.前言 相信做过微信小程序开发的人应该都碰到过这个问题,因为这个需求实在太常见了 由于textarea是属于原生组件,层级最高,不管在页面中我们设置z-index值多少都会被textarea组件遮挡 ...

  2. 解决微信小程序textarea层级太高遮挡其他组件的问题

    <view class='remark'> <view class='title'> 备注说明 </view> <textarea class='mark_t ...

  3. 微信小程序 textarea 层级过高的解决方式

    建立一个新的textarea 组件代替原生textarea ,废话不多说,上代码 <template> <view class="ui-textarea"> ...

  4. 微信小程序echarts层级太高

    项目中因为需求,底部的tab导航栏是自己写的,在开发者工具中一切正常:但是在真机上页面滑动时,echarts的层级比tab高,调过两者的z-index后仍然如此. 经过查找后发现cover-view和 ...

  5. 微信小程序 textarea的placeholder层级过高 在弹层之上 bug解决方法

    微信小程序textarea的placeholder的层级一直都是一个神坑, 我们是没有办法将我们的弹层加大层级去盖过placeholder的, 所以要解决这个问题只能从另外的角度找思路 我的思路是 : ...

  6. 微信小程序 textarea 简易解决方案

    微信小程序中textarea没有bindchange事件,所以无法在输入时给变量赋值. 虽然可以使用bindblur事件,但是绑定bindblur事件,如果再点击按钮,则先执行完按钮事件后,再去执行b ...

  7. 解决微信小程序textarea 里输入的文字或者是placeholder里的值,飘到弹出view上

    在uniapp微信小程序开发中使用textarea,结果发现输入框的问题浮动起来,view无法把他覆盖,设法设置index的值也不生效,所以只能是通过条件v-if或者v-show使其隐藏就可以了

  8. 微信小程序wx:for隐藏遍历的最后一个元素

    微信小程序开发时有时会需要从wx:for遍历的元素中选取最后一个来进行相关操作,以下方法以隐藏最后一个元素为例 index==list.length-1 通过获取列表的总长度减一来得到最后一个元素是最 ...

  9. 微信小程序swiper高度自适应,swiper的子元素高度不固定

    小程序 swiper 组件默认高度150px,并且如果子元素过高,swiper不会自适应高度 解决方案一: (总体来说不够完美,适合满屏滑动) 如果不是满屏的状态,用scroll-view IOS滑动 ...

随机推荐

  1. 如何在jupyter中安装R

    地址:(http://irkernel.github.io/installation/) 第一步:在R中安装必备包 install.packages(c('repr', 'IRdisplay', 'e ...

  2. Jekyll添加FancyBox 插件

    一.简要 这是之前在GitHub Page上面使用博客功能的完善,之前每次传到GitHub上面的图片在博客里面都是显示压缩后的,导致很多代码细节都看不清. Markdown 语法中的图片我们一般是如此 ...

  3. Codeforces Round #590 (Div. 3)【D题:26棵树状数组维护字符出现次数】

    A题 题意:给你 n 个数 , 你需要改变这些数使得这 n 个数的值相等 , 并且要求改变后所有数的和需大于等于原来的所有数字的和 , 然后输出满足题意且改变后最小的数值. AC代码: #includ ...

  4. left

    left 语法: left: auto | <length> | <percentage> 默认值:auto 适用于:定位元素.即定义了 <' position '> ...

  5. [Luogu] 线段树 2

    https://www.luogu.org/problemnew/show/P3373 双懒标记下放 先乘后加 #include <bits/stdc++.h> using namespa ...

  6. Dockerfile创建tomcat和jdk,并发布java项目

    1.准备好需要的jdk 和 tomcat kun@ubuntu:~$ cd tomcat-docker/ kun@ubuntu:~/tomcat-docker$ ll total drwxrwxr-x ...

  7. Python学习日记(八)—— 模块一(sys、os、hashlib、random、time、RE)

    模块,用一砣代码实现了某个功能的代码集合. 类似于函数式编程和面向过程编程,函数式编程则完成一个功能,其他代码用来调用即可,提供了代码的重用性和代码间的耦合.而对于一个复杂的功能来,可能需要多个函数才 ...

  8. spring事务配置异常

    spring事务配置不回滚spring事务管理配置,一般来说都是可以回滚的,最近在开发的过程中遇到了一个异常不回滚的问题,最终找到了原因,贴出来一下 1.首先这里定义一个接口 在接口中定义几个方法 2 ...

  9. Ubuntu验证查看库的安装情况

    以下是ubuntu系统安装完成一些库后,验证查看各个库的安装情况. 1. CUDA8.0 yuanlibin@yuanlibin:~$ nvcc -V nvcc: NVIDIA (R) Cuda co ...

  10. 线上bug或故障界定及填写规范

    [线上故障与线上Bug界定] 一.线上故障: 1.  故障参照公司规范稍做调整: a)         1级故障:资讯首页或主App首页无法打开:多条业务线同时不可用:超过15分钟: b)       ...