小程序的事件分为两种,冒泡和非冒泡事件,像<form/>submit事件,<input/>input事件,<scroll-view/>scroll事件等非冒泡事件,需要到组件的文档里去找,如下是我截图的一些常用的非冒泡事件

非冒泡事件:当一个组件上的事件被触发后,该事件不会向父节点传递。

想要实时监听input的输入只要使用bindinput就可以了,

wxml:

  <input bindinput='watchPassWord' type='password' class="weui-input" placeholder="请输入密码" />

js:

Page({
// 监听输入
watchPassWord: function (event) {
console.log(event.detail.value);
}
})

event是当前的事件对象,包含当前的各种信息,detail就是我们需要的信息了,按自己的需求处理就好,console展开如下:

冒泡事件:当一个组件上的事件被触发后,该事件会向父节点传递。

微信小程序监听input输入并取值的更多相关文章

  1. 微信小程序基础之input输入框控件

    今天主要详写一下微信小程序中的Input输入框控件,输入框在程序中是最常见的,登录,注册,获取搜索框中的内容等等都需要,同时,还需要设置不同样式的输入框,今天的代码中都要相应的使用. input输入框 ...

  2. 实时监听input输入内容的N种方法

    现在有一个需求,需要我们实时监听input输入框中的内容,从而带来更好的用户体验,而不是等我们全部输入完毕才告诉我们格式不对首先我们创建一个input输入框 <form name='loginF ...

  3. 微信小程序获取输入框(input)内容

    微信小程序---获取输入框(input)内容 wxml <input placeholder="请输入手机号码" maxlength="11" type= ...

  4. 微信小程序自动去除input空格的方法

    当用户输入账号或者密码的时候,可能会有输入空格的情况,但是实际需要是不能够有空格的,所以我们要做一个去除空格,并且适应所有input的name参数的方法,下面请看源码: wxml: <input ...

  5. jQuery封装自定义事件--valuechange(动态的监听input,textarea)之前值,之后值的变化

    jQuery封装自定义事件--valuechange(动态的监听input,textarea)之前值,之后值的变化 js监听输入框值的即时变化 网上有很多关于 onpropertychange.oni ...

  6. 微信小程序怎么获取用户输入

    能够获取用户输入的组件,需要使用组件的属性bindchange将用户的输入内容同步到 AppService. <input id="myInput" bindchange=& ...

  7. 微信小程序tips集合:无法输入文字/随时查看页面/元素审查/点击事件/数据绑定

    1:编辑文档无法输入文字 出现这种情况一般是因为之前编辑的文档未保存,所有在其他文档输入的时候会自动输入到未保存的文档中,在文档暂时编辑完毕后要ctrl+s随手保存,不然会出现无法打字情况 2: 随时 ...

  8. 实时监听input输入的变化(兼容主流浏览器)【转】

    遇到如此需求,首先想到的是change事件,但用过change的都知道只有在input失去焦点时才会触发,并不能满足实时监测的需求,比如监测用户输入字符数. 在经过查阅一番资料后,欣慰的发现firef ...

  9. 微信小程序----搜索框input回车搜索事件

    在微信小程序里的搜索框,按软键盘回车键触发搜索事件. <input type="text"  placeholder="搜索" value="{ ...

随机推荐

  1. ArcGIS API for JavaScript 4.2学习笔记[9] 同一种视图不同数据(Map)同步

    本例子核心:对MapView对象的map属性值进行替换即可达到更改地图数据的效果. 这个例子用的不是Map对象了,而是用的发布在服务器上的专题地图(WebMap)来加载到MapView上进行显示. 在 ...

  2. ArcGIS API for JavaScript 4.2学习笔记[14] 弹窗的位置、为弹窗添加元素

    这一节我们来看看弹窗的位置和弹窗上能放什么. 先一句话总结: 位置:可以随便(点击时出现或者一直固定在某个位置),也可以指定位置 能放什么:四种,文字.媒体(图片等).表格.附件. [Part I 位 ...

  3. ubuntu下加载mcypt

    mcrypt 是php 里面重要的加密支持扩展库,linux环境下:该库在默认情况下不开启.window环境下:PHP>=5.3,默认开启mcrypt扩展 1.命令行下载(不嫌麻烦可以到网上找安 ...

  4. date 命令详解

    date - print or set the system date and time Display the current time in the given FORMAT, or set th ...

  5. My Go Resolutions for 2017(from Russ cox's blog)

    我的2017年Go决议 一年之季始于春,我认为写一些今年我希望在Go上做的东西是有意义的. 我每年的目标是帮助Go开发人员.我想确保我们在Go团队中所做的工作对Go开发者有重大的积极影响.可能听起来很 ...

  6. vue过滤数字为2位小数点,过滤器

    过滤数字为2位小数点 filters: { //保留2位小数点过滤器 不四舍五入 number(value) { var toFixedNum = Number(value).toFixed(3); ...

  7. Java实现矩阵计算器【代码】

    其实这个程序最开始是大二下学期Java的一次平时作业,当时只要求产生几个随机矩阵并对这些矩阵进行计算. 所以当时没去实现现在这么丰富而且实用的功能.不过当时倒是挺想去做的,无奈有些不知道怎么去实现. ...

  8. flex弹性布局语法介绍及使用

    一.语法介绍 Flex布局(弹性布局) ,一种新的布局解决方案 可简单.快速的实现网页布局 目前市面浏览器已全部支持1.指定容器为flex布局 display: flex; Webkit内核的浏览器, ...

  9. 警惕phpstudy等开发神器使用默认配置可能带来的危险

    0x00 前言 其实这个点早在之前,我就已经想到了,当时也觉得没啥就记在了我的印象笔记里. 而今天重新把这个点拿出来讲,主要是因为今天早上在温习nmap的时候,一不小心利用这个点,拿下了一位同事的电脑 ...

  10. Factom(公证通)--基于区块链的存证系统

    Factom这个Solution在2014年的时候就已经推出了,现在已经2018年了,我才来写这一篇分析文章可能有些迟了,但是它是十分具有参考价值的.因为现阶段来开区块链虽然炒得火热--养猫.养狗.草 ...