微信小程序使用JS隐藏view

最新推荐文章于 2024-04-21 16:52:00 发布
最新推荐文章于 2024-04-21 16:52:00 发布
阅读量2.2w 收藏 6
点赞数
分类专栏： 微信小程序 文章标签： 微信小程序 DOM节点操作 隐藏view JQUERY选择器 渲染
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u010802056/article/details/54580666
版权

我的需求很简单，表单focus隐藏提示view,blur显示view




百度了很久关于类似JQUERY的写法都没有说明，微信官方也没有教程，类选择器和ID选择器都没有用，document也没用，后来使用渲染的方式实现，关键代码如下


视图代码，使用变量控制隐藏类名


类名默认为空串



再获取焦点的事件中，修改data值


就可以达到隐藏的效果


技术部-祝福
关注
  • 0
    点赞
  • 踩
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
微信小程序动态添加view组件的实例代码
10-16
本文通过实例代码给大家介绍了微信小程序动态添加view组件的方法，代码简单易懂，非常不错，具有一定的参考借鉴价值,需要的朋友可以参考下
微信小程序的页面隐藏
Befearless
07-22 1808
点击一下 下面的页面隐藏起来 <view bindfocus="show_so_input" /> </view> //将页面单独隐藏 <view class="ment_top" wx:if="{{show_dibu}}"> <view class="bottom_but" >首页</view> <view class="bottom_but ">我的</view> </view> sh...
微信小程序动态显示和隐藏某个控件
厦门在乎科技
07-02 814
在小程序的开发过程中，经常需要用到隐藏某个控件这种情况。 因为项目原本是需要将两个canvas切换，但是小程序的canvas支持的功能实在是少，本来就jQuery mobile或者将canvas转为图片就可以很容易实现滑动效果，但是都不支持，最后只能是做一个canvas，需要时显示，不需要时隐藏。 实现方法： logs.wxml <view> <button bindtap="onChangeShowState">{{showView?'Click To Check Idl
微信小程序-web-view-开发日记，看这一篇就够了！，38岁的中年失业者怎么活下去
m0_61549674的博客
03-22 586
本文在开源项目GitHub中已收录，里面包含不同方向的自学编程路线、面试题集合/面经、及系列技术文章等，资源持续更新中…[外链图片转存中…(img-GX0yUJRe-1711089460471)]
微信小程序控制元素显示隐藏
每天都想吃好吃的
01-04 818
在微信小程序中，可以通过设置元素的 wx:if 或 wx:show 属性来控制元素的显示和隐藏。在对应的 js 文件中，设置 isShow 变量的值，来控制元素的显示和隐藏。在对应的 js 文件中，设置 isShow 变量的值，来控制元素的显示和隐藏。通过以上两种方式，可以根据业务逻辑来控制元素的显示和隐藏。，从而动态控制元素的显示和隐藏。点击按钮时，通过调用。的值，从而实现元素的显示和隐藏效果。
微信小程序点击显示和隐藏
weixin_46504346的博客
06-14 4397
2、在对应的js文件中，先定义一个变量，用于标识当前按钮或者元素的状态，比如：var isShow = false;1、在wxml文件中定义按钮或者其他需要点击显示和隐藏的元素，并设置按钮或者元素的样式和属性。这样就可以实现微信小程序的点击显示和隐藏功能了。
微信小程序使用JS隐藏view，结合css语法处理
风清扬的博客
09-12 1万+
开始写技术博客，当做一个积累，也是思路的沉淀，也希望可以帮助到同行的小伙伴！ 首先可以看下这篇文章， http://blog.csdn.net/u010802056/article/details/54580666 我是参考这个，但是没有解决了，然后瞎想，就解决了 大概分3不： 1、定义变量、需要在前端xml中使用 Page({ data: { conf
微信小程序学习——view的显示与隐藏
热门推荐
Brindy_Z的博客
09-18 2万+
微信小程序学习——view的显示与隐藏 需要在全局数据块中，设定一个控制键。 data: { ......//省略其他代码 showView: true }, 然后是在wxml中，view的class中设置2个class，并用三目表达式来进行设定class。代码如下： &lt;view class="{{showView?'header_view_show':'heade...
【uniapp】微信小程序点击控制div的显示与隐藏以及点击的是第几个
ONLYSRY的博客
07-20 1819
代码】微信小程序点击控制div的显示与隐藏以及点击的是第几个。
微信小程序 在index.js中改变全局变量 使得index.wxml中的数据显示和隐藏
幸运的小菜鸟的博客
05-25 3074
如何有效的改变全局变量？？ 请各位大佬帮我看看 十分感谢 index.wxml代码如下： 在这里插入代码片 <view class='message' bindtap='goToDetail' wx:for='{{messageList}}' wx:for-item='list' wx:key='{{list.id}}' data-id='{{list.id}}'> &l...
微信小程序 scroll-view隐藏滚动条详解
01-03
在书写网页的时候，往往会为了页面的美观，而选择去掉滚动区域默认的滚动条，而在这里，就是为小程序去掉滚动条的其中的一种方法： scroll-view.wxml: scroll-view.wxss scroll-view.js  最终显示效果如下; ...
详解微信小程序 通过控制CSS实现view隐藏与显示
12-29
详解微信小程序 通过控制CSS实现view隐藏与显示 实现效果图： 视图代码，使用变量控制隐藏类名 <scroll scroll-y=true> <view class=user_freeback> <view class=txt> <text> 为了更好地帮助您解决问题,请准确填写您的邮箱地址和电话号码，以便管理员给你答复。</text> </view> </view> <view class=section> <view class=section__title
微信小程序使用mock.js提供模拟数据，提示输入对话框prompt
03-29
最近公司项目需要，体验了一下微信小程序，制作了几个功能，布局感觉很简单，但是交互和动画等写起来确实很费劲，主要是因为他不能操作DOM，只能修改数据！下面介绍一下我制作小程序完成的几个小的功能，希望能够给...
微信小程序使用video组件播放M3U8视频卡顿
01-20
微信小程序中使用video组件播放m3u8直播视频，在ios的真机预览里点击video中间的播放容易卡几十秒，此时什么都做不了，手机也非常非常卡。 我的解决办法是在视频video组件里加入custom-cache={{false}} autoplay=...
详解微信小程序——自定义圆形进度条
01-03
微信小程序 自定义圆形进度条，具体如下： 无图无真相，先上图： 实现思路，先绘制底层的灰色圆圈背景，再绘制上层的蓝色进度条。 代码实现： JS代码： Page({ data: {}, onLoad: function (options) { // ...
【埋点探针】微信小程序SDK安装
最新发布
webfunny2020的博客
04-21 496
点位上报完成后，可以在点位测试里验证是否上报成功了。选择点位后，如果能搜索出结果，则说明点位上报成功了。在项目根目录下，创建sdk文件，webfunny.event.js。点位上报十分方便，只需要将下边的点位信息复制下来，放入代码中即可。埋点SDK引入后，则可以开始上报点位信息了。如果你是前端工程师同学，对埋点系统想要实操，选择Wechat，复制sdk代码。
【uniapp】微信小程序2024手机号快速验证及无感登录教程(内附代码)
C站全栈优质创作者、阿里云受邀博主专家，喜欢结识新伙伴寻找志同道合的朋友，欢迎一起探讨学习
04-19 712
最近注册了公司，可以注册具有支付能力的小程序了，各种材料加备案、认证差不多花了一个月的时间，打算接入支付后，接入一个快速注册的组件，给用户带来便捷的操作体验，发现uniapp的文档不多，于是自己踩了坑，本次简单记录一下，方便以后使用回顾《记一次云之家签到抓包》《记一次视频抓包m3u8解密过程》《抓包部分软件时无网络+过代理检测 解决办法 安卓黄鸟httpcanary+vmos》《Python】记录抓包分析自动领取芝麻HTTP每日免费IP（成品+教程）》
微信小程序展示倒计时
qq_46376192的博客
04-17 670
微信小程序展示倒计时
使用微信开发者工具模拟微信小程序定位
若不知道要驶向哪个码头，那么任何风都不会是顺风。
04-21 877
哈喽，各位同僚们，我们平时在测试微信小程序的时候，如果小程序中有获取定位或者地图的功能，测试场景中常常需要去模拟不同的位置，例如我们模拟在电子围栏的外面、里面和边界区域等。那么，我们如何在模拟微信小程序的不同位置呢？我曾经使用过一些模拟位置的APP软件，例如：Fake Location、MockGPS、爱思助手等，那么如果微信小程序根据IP地址判断位置，而非通过GPS或WIFI等方式来确定位置的话，此类软件就会失去作用，下面将于大家分享使用微信开发者工具模拟小程序定位。
微信小程序原生 picker-view的使用
09-06
微信小程序的原生 picker-view 是一种可以进行滚动选择的组件...通过以上步骤，就可以在微信小程序中使用原生 picker-view 组件实现选择器的功能。用户可以滚动选择选项，并通过自定义的事件处理函数来获取选中项的值。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值