微信小程序中input标签详解及简单实例


Posted in Javascript onMay 18, 2017

微信小程序中input标签详解及简单实例

使用input标签,我们都会,在微信小程序中使用,必定也是可以一下子就会的,但是却有些常用的属性无法按照习惯去使用:
我就用我最常用的来做例子:

一个一个来解读:

首先,我是定义了他的id,这是我们最常用的,所以就配了一个id,毕竟不操作他,又为什么设成输入框呢, 
第二,设置他的样式, 
第三,设置他的输入类别,以上都是很简单的 
第四。使用正则l;哎限定输入为纯数字。这点可能有点不理解,这是对他的keyup事件监听,将不是纯数字的list无视掉。注意,是对整个,不是经行筛选。 
第五,限制他的输入最多6位数 
第六输入事件监听。这是微信专属的,他的事件下面会给出 
第七,设置当输入框为空的时候他的‘提示语';

bindinput事件:

bind,顾名思义是绑定,绑定input输入

事件如下:

tapevent:function(e){
  // 减少的时候
  if (e.target.id =="increase"){
this.data.tickets++;
this.setData(this.data);
  }
  else {
   this.data.tickets--;
   this.setData(this.data);
  }
  // 在这里修改总额
 },

这是节选,所以先不要好奇怎么运行到这一段的,看得出来。tapevent被定义为一个function。并且在这经行操作,感觉微信跟Android差不多。都是靠刷新页面来的。

感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
JavaScript 字符串与数组转换函数[不用split与join]
Dec 13 Javascript
基于JQuery制作的产品广告效果
Dec 08 Javascript
js获取IP和PcName(IE)在vs中可用
Aug 02 Javascript
javascript中不提供sleep功能如何实现这个功能
May 27 Javascript
JavaScript中的getDay()方法使用详解
Jun 09 Javascript
jQuery动画效果图片轮播特效
Jan 12 Javascript
漂亮实用的页面loading(加载)封装代码
Feb 03 Javascript
Angular.Js中ng-include指令的使用与实现
May 07 Javascript
js 图片转base64的方式(两种)
Apr 24 Javascript
解决vue的变量在settimeout内部效果失效的问题
Aug 30 Javascript
JS中使用cavas截图网页并解决跨域及模糊问题
Nov 13 Javascript
vue实现文字横向无缝走马灯组件效果的实例代码
Apr 09 Javascript
JavaScript运动框架 链式运动到完美运动(五)
May 18 #Javascript
JavaScript运动框架 多值运动(四)
May 18 #Javascript
微信小程序页面开发注意事项整理
May 18 #Javascript
基于BootStrap的前端分页带省略号和上下页效果
May 18 #Javascript
微信小程序网络请求wx.request详解及实例
May 18 #Javascript
微信小程序实现锚点定位楼层跳跃的实例
May 18 #Javascript
Vue2 使用 Echarts 创建图表实例代码
May 18 #Javascript
You might like
Symfony数据校验方法实例分析
2015/01/26 PHP
php操作xml并将其插入数据库的实现方法
2016/09/08 PHP
thinkPHP框架可添加js事件的分页类customPage.class.php完整实例
2017/03/16 PHP
Windows上php5.6操作mongodb数据库示例【配置、连接、获取实例】
2019/02/13 PHP
PHP设计模式之组合模式定义与应用示例
2020/02/01 PHP
JavaScript QueryString解析类代码
2010/01/17 Javascript
理解JavaScript的prototype属性
2012/02/11 Javascript
js随机生成字母数字组合的字符串 随机动画数字
2015/09/02 Javascript
JavaScript String(字符串)对象的简单实例(推荐)
2016/08/31 Javascript
详解AngularJS中的表单验证(推荐)
2016/11/17 Javascript
javascript构造函数以及原型对象的理解
2017/01/13 Javascript
IE11下使用canvas.toDataURL报SecurityError错误的解决方法
2017/11/19 Javascript
基于Vue的ajax公共方法(详解)
2018/01/20 Javascript
微信小程序与后台PHP交互的方法实例分析
2018/12/10 Javascript
Vue 表情包输入组件的实现代码
2019/01/21 Javascript
vue学习笔记五:在vue项目里面使用引入公共方法详解
2019/04/04 Javascript
[02:44]DOTA2英雄基础教程 魅惑魔女
2014/01/07 DOTA
在Python的Django框架中更新数据库数据的方法
2015/07/17 Python
Python实现动态添加属性和方法操作示例
2018/07/25 Python
python-sys.stdout作为默认函数参数的实现
2020/02/21 Python
python 如何调用 dubbo 接口
2020/09/24 Python
AmazeUI中各种的导航式菜单与解决方法
2020/08/19 HTML / CSS
世界首屈一指的在线男士内衣权威:HisRoom
2017/08/05 全球购物
城野医生官方海外旗舰店:风靡亚洲毛孔收敛水
2018/04/26 全球购物
台湾母婴用品限时团购:妈咪爱
2018/08/03 全球购物
管道维修工岗位职责
2013/12/27 职场文书
通信生自我鉴定
2014/01/18 职场文书
创业计划书撰写原则
2014/01/25 职场文书
2014年班组工作总结
2014/11/20 职场文书
邀请函样本
2015/02/02 职场文书
总经理司机岗位职责
2015/04/10 职场文书
圆明园纪录片观后感
2015/06/03 职场文书
golang正则之命名分组方式
2021/04/25 Golang
Mybatis是这样防止sql注入的
2021/12/06 Java/Android
MySQL控制流函数(-if ,elseif,else,case...when)
2022/07/07 MySQL
Spring boot admin 服务监控利器详解
2022/08/05 Java/Android