微信小程序当失去焦点时隐藏textarea或者动态显示textarea 5C

我现在做了个小程序,点击评论时弹出输入框,当点击别的地方或者是在真机上按返回键时让输入框消失,我现在做出的效果是输入框一直在呢,除非评论已经完成,否则输入框一直在的
代码如下:

 <view class="release" hidden="{{!releaseFocus}}">
        <form bindsubmit="formSubmit">
          <input hidden='true' name='scId' value='{{scnId}}'></input>
          <textarea class="text" name='content' placeholder-class="input_null" fixed="true" maxlength="-1" show-confirm-bar="false"
            cursor-spacing="15" auto-height="true" focus="{{releaseFocus}}" placeholder='评论'>
          </textarea>
          <button class="submit" form-type="submit">发送</button>
        </form>
      </view>

效果图:
图片说明

求教大神如何让点击别的地方或者失去焦点的时候让这个框消失掉啊,求代码!!!

1个回答

textarea添加bindblur事件,设置releaseFocus为true

tianguozhiya
去你大爷的昵称已存在 回复showbo: 我在开发工具里面用这个测了 刚一闪就没了
大约一年之前 回复
showbo
支付宝加好友偷能量挖 回复tianguozhiya: 手机上没试,开发工具测试了没有这种问题,只是偶尔出现bindblur不执行
大约一年之前 回复
tianguozhiya
去你大爷的昵称已存在 设置为false之后 点击评论框时刚一显示又没了,就是那种闪一下就没了的情况
大约一年之前 回复
showbo
支付宝加好友偷能量挖 不过测试了下bindblur好像有bug。。。开发工具测试10次里面有1,2次第一次显示输入框,点击其他地方无法隐藏。。
大约一年之前 回复
showbo
支付宝加好友偷能量挖 回复tianguozhiya: 应该releaseFocus设置为false。。被你变量名误导了,releaseFocus。。释放焦点。。你当做获取焦点用了
大约一年之前 回复
tianguozhiya
去你大爷的昵称已存在 这个不行啊 设置完以后textarea里面一直闪烁着光标 但是textarea不消失啊
大约一年之前 回复
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
其他相关推荐
微信小程序 textarea
微信小程序中textarea没有bindchange事件,所以无法在输入时给变量赋值。虽然可以使用bindblur事件,但是绑定bindblur事件,如果再点击按钮,则先执行完按钮事件后,再去执行bindblur事件,所以在js文件取不到输入值 ... 属性名 类型 默认值 说明 bindblur EventHandle...
Textarea输入框失去焦点时隐藏手机键盘
今天在做公司年会的手机端上墙页面,发现在输入完成后,点击输入框以外的任何区域,键盘收起输入框没有自动回弹。 后面发现这种情部只是在iphone下才会产生,原来在点击空白的document处textarea并不能失去焦点,解决方案如下: //判断是否为iphone var isIPHONE = navigator.userAgent.toUpperCase().indexOf('IPHO...
【微信小程序】TextArea的坑
今天遇到一个textArea的坑,先上个图。1.点击“选择内容反馈”,弹出action-sheet时,有时点击第一个条目“讲太快”,textArea会把焦点劫走。2.解决方法,当actionsheet显示时,设置textarea的disabled属性为true. 即将textarea的disabled属性置为action-sheet的hiddden属性的取反值。...
微信小程序textarea组件
textarea 多行输入框。该组件是原生组件,使用时请注意相关限制。 属性名 类型 默认值 说明 最低版本 value String   输入框的内容   placeholder String   输入框为空时占位符   placeholder-style String   指定 place...
微信小程序----组件之textarea
效果图: 项目结构: 核心代码: index.wxml 使得输入框获取焦点 提交 index.js //textarea.js Page({ data: { height: 20, focus: false }, bindButtonTap: fu
小程序之textarea坑
textarea真是个大坑,具体总结如下: textarea 可以换行 小程序里面首选 但是如果一个页面里面有textarea 最好不要有弹框,因为就会出现如下情况 之所以会出现这个问题,查明原因是因为textarea的层级最高,是无法被弹层遮盖,所以小程序里面的添加资料区域基本(因为本人只翻了30多个小程序,没有翻看所有小程序,所以这里说是基本)都是input 的输入(无法换行),弹层...
微信小程序 textarea的show-confirm-bar=false 完成按钮不隐藏
问题 textarea组件加上show-confirm-bar=“false”,完成按钮不隐藏 方法 show-confirm-bar = "{{false}}"
微信小程序 textarea的一个“bug”
感觉也不算bug,但是又算bug,怎么说呢?先上张图片问题是啥?问题自然是那行完成了。当然小程序的文档说可以使用show-confirm-bar来设置,但是相信很多朋友也是设置了都没用,但是如果改成show-confirm-bar=&quot;&quot;就起作用了。有趣&amp;lt;textarea value=&quot;这个是textarea&quot; show-confirm-bar=&quot;&quot;&amp;gt;&amp;lt;/textarea&amp;gt;所...
微信小程序textarea问题总结
微信小程序textarea问题总结 1.textarea多行输入框。该组件是原生组件 2.参考文档中的原生组件说明https://developers.weixin.qq.com/miniprogram/dev/component/native-component.html 原生组件的层级是最高的,所以页面中的其他组件无论设置 z-index 为多少,都无法盖在原生组件上。 后插入的原生...
微信小程序 textarea 统计输入长度
wxml &amp;amp;lt;view class=&amp;quot;weui-cells weui-cells_after-title&amp;quot;&amp;amp;gt; &amp;amp;lt;view class=&amp;quot;weui-cell&amp;quot;&amp;amp;gt; &amp;amp;lt;view class=&amp;quot;weui-cell__bd&amp;quot;&amp;amp
微信小程序textarea爬坑整理
1.手机端placeholder属性会随页面滚动 由于我整个页面要大于手机视窗,于是我设置了overflow:hidden属性,但是textarea里的placeholder中的文字依然会随着屏幕滑动。 解决方法 在textarea中设置fixed='true’属性 2.textarea层级在最上层,z-index无效 这个问题应该很多人都遇到了,目前也没有特别完美的解决办法,目前主流的两种解决方...
微信小程序 textarea 组件详解及简单实例
微信小程序textarea 相关文章: 微信小程序 Button 微信小程序 radio 微信小程序 slider 微信小程序 switch 微信小程序 textarea 微信小程序 picker-view 微信小程序 picker 微信小程序 label 微信小程序 input&nbsp; 微信小程序 form 微信小程序 checkbox 多行输入...
求指教!微信小程序 textarea的坑
项目需求:rn 收集用户填写的信息;分类比较多,所以用了分页功能;rn具体效果如图rn[img=https://img-bbs.csdn.net/upload/201811/05/1541405292_172990.gif][/img]rnrn现在的问题是textarea 的提示信息和内容在真机运行的时候不跟随输入框一起走,而是等动画完成后才消失;rn之前是用的swiper做的切换,后来因为这个问题换成了animation;rn但是还是存在这个BUG;是因为某个父元素有overflow属性;切换分页的效果不用overflow:hidden;的话 好像实现不了;rn这个需求到底能不能实现;希望大神指点一下思路;
微信小程序Textarea踩坑
功能是需要写一个评论框 ,左边图片图标要和文字对齐,在模拟器和安卓手机上测试没问题,在苹果手机上测试,不管怎么样都对不齐,苹果手机真机调试发现textarea竟然上下有padding.........并且设置padding:0没用 解决方法:判断手机操作系统来改变图标到底部的距离.(左边图标用绝对定位absolute写的) wx.getSystemInfo().then(res =&amp;gt...
微信小程序textarea 限制字数js
wxss: .refund{ width: 96%; margin: auto; display: flex; flex-direction: column; } .refund .text{ color: #333333; font-size: 28rp...
微信小程序学习笔记(十六)textarea
auto-height 自动变高 bindfocus 光标聚焦事件 bindblur 光标失焦事件 bindinput 当键盘输入时,触发 input 事件&amp;lt;view class=&amp;quot;section&amp;quot;&amp;gt; &amp;lt;textarea style='width:200px;border:1px solid red' bindblur=&amp;quot;bindTextAreaBlur&amp;quot; auto-height place
微信小程序-textarea字数统计与限制
第一步:参考官方文档《textarea小程序》 textarea多行输入框。该组件是原生组件,使用时请注意相关限制。 用到的属性: 属性 说明 maxlength 最大输入长度,设置为 -1 的时候不限制最大长度 minlength 最小输入长度 bindinput 当键盘输入时,触发 input 事件,event.detail = {value, cur...
微信小程序开发之textarea坑
相信如果在开发小程序中使用过textarea的小伙伴们应该清楚这个连官网都还没有暂解之法,所以在平时的开发中是尽量避免使用这个坑,但如果真的非要使用,那咋办呢?故记下我的两个思路,如各位有更好的方法,还请赐教留言~ 方法一:模拟textarea样式文本框,点击切换为textarea,失焦切换虚拟文本框 即wxml: &amp;lt;textarea placeholder='请输入文本' bindb...
微信小程序动态显示或隐藏
微信小程序开发中可能会遇到这种情况,某个控件会因为按钮的点击显示或隐藏,同时按钮的文字也随点击改变。
小程序中textarea的问题
1.textarea在view的包裹下,当上下拖动屏幕时,view的布局没动,但是textarea的布局却上下移动,而且在小程序的IDE上又不能重现此问题。 解决方法:在textarea中添加fixed=&quot;true&quot;, 2.textarea聚焦弹出软件盘时盖住了textarea的输入框; 解决方法:添加属性cursor-spacing=&quot;20&quot;,其中20是一个数字,代表光标距离软键盘的高度有...
小程序textarea缓存问题
&amp;lt;textarea placeholder='' bindinput='listenerTextarea' wx:if=&quot;{{textarea}}&quot;&amp;gt;{{textarea}}&amp;lt;/textarea&amp;gt; &amp;lt;textarea placeholder='请输入表达一下你的创意或想法' wx:else bindinput='listenerTextarea'&amp;gt;&amp;lt;...
小程序textarea问题与处理
应用textarea标签如下: 显示超行并逐行严重重影,如下: 加入形式限制word-wrap:break-word,不再超行,但仍然严重重影,网上多说是父标签中含有flowover:auto,去掉依然不解决问题。多次试验,只要不在textarea标签中用{{变量}},用不用flowover:auto都没有关系,代码: 效果: ...
小程序textarea字体错位
遮罩层盖不住 原因:这是因为textarea和input框的z-index为最高,自己写的蒙层盖不住。 处理方法:wx:if=’{{!modal}}’,弹框出现时隐藏输入框 弹框中又textarea,placeholder字体位置错位 原因:弹框fixed定位,小程序兼容问题 解决方法: ...
textarea 限制字数,同时动态显示字数
文本框输入事件:onchange 、onkeyup 、onblur,oninput onchange在用于文本框输入框时,有一个明显的不足. 事件不会随着文字的输入而触发,而是等到文本框失去焦点(onblur)时才会触发. 也就是没有即时性! oninput 事件在用户输入时触发。该事件类似于onchange 事件。不同之处在于 oninput 事件在元素值发生变化是立即触发, onchang
隐藏的textarea取值
只要把textarea设成隐藏的。就怎么也取不到值。。又要隐藏又要取值怎么办?
textarea怎样隐藏滚动条
场景 textarea设置隐藏滚动条。 实现 设置横向滚动条: &lt;textarea id=txtComments style="overflow-x:hidden"&gt;&lt;/textarea&gt; 设置竖向滚动条: &lt;textarea id=txtComments style="overflow-y:hidden"&gt;&lt;/textarea&gt; ...
textarea的显示与隐藏
找了不少方法,以下方法在微信小程序中是有效的。已证明。 不显示 : &lt;textareaname="hide"style="display:none;"&gt;asdfsadfsfsa&lt;/textarea&gt; 显示: &lt;textareaname="hide"style="display:true;"&gt;asdfsadfsfsa&lt;/texta...
【微信小程序】小程序动态显示和隐藏某个控件
在小程序的开发过程中,经常需要用到隐藏某个控件这种情况。 因为项目原本是需要将两个canvas切换,但是小程序的canvas支持的功能实在是少,本来就jquery mobile或者将canvas转为图片就可以很容易实现滑动效果,但是都不支持,最后只能是做一个canvas,需要时显示,不需要时隐藏。 实现方法: logs.wxml {{showView?'Click To Check
微信小程序开发(三)textarea的bug
最近在开发一个商城项目,其中有一块是评价,就像淘宝手机端的评价那样。首先看看我的页面结构。 就是一个页面可以多多个商品进行评价,每个写具体评价的位置是一个textarea。使用微信小程序开发公司调试是没有问题的,但是在手机端调试就有问题。 就是textarea不能跟随一起滚动。 微信小程序给了一些Bug和建议: 我这个界面底层并没有使用scroll-view,但是还是有问题。感觉
微信小程序开发-textarea高度问题
正在做一个记事本的小程序记事自然少不了textarea组件编辑页面我的设计是上面一行标题栏,下面一行按钮操作区,中间就是textarea填充剩余空间效果如下图使用flex布局很容易就做到上述效果,一个container包含一个竖直排列的三个view中间的view放textarea&amp;lt;!--index.wxml--&amp;gt; &amp;lt;form bindsubmit=&quot;onSubmit&quot; bind...
textarea
textarea 随内容高度固定,自动增宽;宽度固定,自动增高;<br>以及 wrap 的几种属性简介。
TextArea ?
请问,如何在TextArea的Onclick()事件中得到鼠标所选择的是第几行?rnrn
textarea?
大家好,请问在textarea文本框中,我想默认读取数数据 库里的一字段数据,且其以灰色显示不能对其修改,但可以在里面继续增加内容?要怎么做好?
TextArea
我用TextArea来显示数据库中读取的数据rn但在TextArea中显示是一行的,我想换行显示,应该怎办呢
微信小程序-textarea获取输入值(在modal中获取值)
我的页面是这样的。我要点击微信自带的modal中按钮获取textare的输入值(下面的页面已经改好了)文档上的bindblur事件根本就满足不了使用,因为我在点击按钮后先调用了confirm方法,然后才会调用bindblur事件的方法获取textare值。所以就没办法进行了。网上有的博客中写的是用form表单触发的事件,这样就能先触发bindblur事件获取textare值,然后在触发点击按钮的事...
微信小程序学习笔记( 动态获取 textarea 里面输入字数)
因为小程序是数据驱动视图的 你.wxml 页面写 &amp;lt;textarea value='{{userInput}}' bindinput='bindWordLimit'&amp;gt; 复制代码在data里面定义一个变量 data:{ userInput:' ' } 复制代码bindinput EventHandle 当键盘输入时,触发 input 事件,event.detail = {value,...
textarea隐藏,如何赋值呢?
如题,一个表单中,如果是一个textarea,可以用:document.getElementById("content").value="1111"这样来赋值,但是如果这个是一个隐藏textarea的在线编辑器,如:rnrnrnrnrnrnrn这样表单中,隐藏了id=content的textarea,似乎是在iframe中操作的,这样如何赋值到iframe中呢?
请问如何隐藏textarea的边框?
我想隐藏文本框的边框,对text可以添加如下属性:rnrnstyle="BORDER-BOTTOM-STYLE: none; BORDER-LEFT-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-TOP-STYLE: none"rnrn但是对于多行文本textarea,右边的下拉框却总是不能隐藏,请各位大侠帮我
微信小程序 —— input、textarea层级穿透问题
问题: 当页面中有input 、textarea时 底部提交按钮position:fiexd悬浮时 在滑动页面,input 、textarea文本框中的文字会穿透到提交按钮上方 z-index分别在子层级,和父层级上设置这个属性,哪个值大,哪个层级就在最上面。 textarea上,设置z-index:0,这样,在模拟器上运行就没问题了,但是iOS真机就无效了。z-index会失去作用。textar...
解决微信小程序textarea层级太高的问题
有时候textarea和select同时存在的表单中,select需要弹出一个弹框来供选择,会出现textarea层级太高,无法被弹框遮盖的情况,那么咱们该如何解决呢?解决方法:把textarea的节点wx:if=”{{false}}” &amp;lt;textarea wx:if=&quot;{{isShow}}&quot; value=&quot;{{content}}&quot;&amp;gt;&amp;lt;/textarea&amp;gt;动态设定isSho...
相关热词 c# login 居中 c# 考试软件 c# 自然语言分析 c# 分段读取文件 c# 泛型反射 c#打断点 c# 时间转多少秒 c# 线程函数加参数 c# modbus 读取 c#查询集合表

相似问题

1
为什么微信小程序里textarea输入2000字后页面最后顶出一些空白?
1
求教:小程序开发中not defined的问题
5
原生JS实现Textarea汉字字数判断
1
使用layui的富文本编辑器 上传图片后不能显示图片 只能显示图片名
1
微信小程序 textarea的position设置为fixed时滚动不了。
2
如何用vue做一个只有5分钟时限的文本框,时限过后不可编辑
1
vue监听显示textarea中英语单词数(不是字符数)并限制单词数在30以内
0
vue监控textarea中单词数(不是字符数)不能超过30个单词且单词数过20个wordcount后数字变红
0
vue如何限制textarea的空格数
1
富文本编辑器添加超链接,如何让textarea选中的内容,在点击input之后不失去焦点?(类似于)
1
读取word文件,出现乱码,应该怎么解决
0
为什么我在ecplise添加一个多行文本框textArea,但是在source里无法调用textArea?
0
获取页面控件时,如何避免那些不是表单中的控件
1
ie中textarea在动态清空后马上输入会出现异常
3
PHP交友系统怎么实现只有异性之间可以私信?
1
绝对定位后,我的内容不显示了怎么办
1
showTabBarReddot or setTabBarBadge无效没报错
0
Django表单提交问题,后端接收不到数据
1
给antd的Input组件设置动态的value,目前不能手动的更改页面输入框内的内容,应该怎么办呢
1
JAVA,GUI聊天功能,只做到发送信息和聊天记录,但是聊天记录不知道为什么不能不能查看