WXML节点信息API
来源:互联网 发布:网络教研三剑客 编辑:程序博客网 时间:2024/06/10 16:58
wx.createSelectorQuery()
在微信小程序里调用后:返回一个SelectorQuery对象实例。可以在这个实例上使用select等方法选择节点,并使用boundingClientRect等方法选择需要查询的信息。
用其中一个方法来举例:selectorQuery.select(selector)
在开发小程序中会有一个弹出输入框,点击发表的时候,要获取弹框里的输入值value。运用官方给的方法是用到textarea里的bindinput方法:当键盘输入时,触发 input 事件,event.detail = {value, cursor},如图:
其实利用select方法,在textarea标签里添加id:comment-textarea,wxml代码如下:
<!-- 弹出评论框 --> <view class="record-container" wx:if="{{openConfirm}}" capture-catch:touchmove="fixed"> <view class="record-gird"> <textarea class="comment_text" id="comment-textarea" placeholder="最多可输入500字" name="textarea" maxlength="500" fixed/> <view class="weui-flex"> <view class="weui-flex__item"> <button bindtap="bindFormSubmit" class="com_btn">发表</button> </view> <view class="weui-flex__item" bindtap="closeConfirm"> <button class="com_btn" style="color: #783DCF;background: #fff;border: 1px solid #783DCF;">取消</button> </view> </view> </view> </view>
js代码:
function bindFormSubmit() { // 发表评论 wx.createSelectorQuery().select('#comment-textarea').fields({ properties: ['value'] }, function(res) { var content = res.value; }).exec()}
nodesRef.fields(fields, [callback])
获取节点的相关信息,需要获取的字段在fields中指定。返回值是nodesRef对应的selectorQuery。
properties []:指定属性名列表,返回节点对应属性名的当前属性值
selectorQuery.exec([callback])
执行所有的请求,请求结果按请求次序构成数组,在callback的第一个参数中返回。
最终所要获得的提交内容content直接在返回值res里面获取。
官方给的代码例子:
Page({ getFields: function(){ wx.createSelectorQuery().select('#the-id').fields({ dataset: true, size: true, scrollOffset: true, properties: ['scrollX', 'scrollY'] }, function(res){ res.dataset // 节点的dataset res.width // 节点的宽度 res.height // 节点的高度 res.scrollLeft // 节点的水平滚动位置 res.scrollTop // 节点的竖直滚动位置 res.scrollX // 节点 scroll-x 属性的当前值 res.scrollY // 节点 scroll-x 属性的当前值 }).exec() }})
阅读全文
0 0
- WXML节点信息API
- 小程序文档整理之 -- API(WXML节点信息)
- 节点信息
- html_dom节点节点信息
- Zookeeper实例原生API--无权限信息的Zookeeper会话访问有权限信息的节点
- 用maya API获取DAG节点的path和matrix信息
- Zookeeper实例原生API--使用错误权限信息的ZooKeeper会话访问含权限信息的数据节点
- 查看集群节点api
- 强制清除节点信息
- HTML DOM 节点信息
- xml节点信息
- HTML DOM 节点信息
- DOM节点信息
- HTML DOM 节点信息
- dom 二 节点信息
- HTML DOM 节点信息
- XML DOM 节点信息
- ZTree 获取节点信息
- 10:简单密码
- Docker源码分析(四):Docker Daemon之NewDaemon实现
- 【Spring】Spring开启注解配置
- 关于Dalston.SR3版本的spring cloud,用feign客户端调用服务hystrix不能生效的问题
- oracle体系结构-一条sql说明oracle体系结构
- WXML节点信息API
- 字符串的查找删除
- java求排列组合数
- MySQL explain执行计划参数说明
- jsonp跨域百度
- Docker源码分析(五):Docker Server的创建
- 【安全牛学习笔记】 本地提权
- 二叉排序树的构造、深度优先遍历、广度优先遍历
- 2017.9.15