微信小程序中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 函数对象的多重身份
Jun 28 Javascript
javascript定时变换图片实例代码
Mar 17 Javascript
js字符串转换成数字与数字转换成字符串的实现方法
Jan 08 Javascript
JavaScript使用push方法添加一个元素到数组末尾用法实例
Apr 06 Javascript
基于javascript实现动态显示当前系统时间
Jan 28 Javascript
JavaScript函数柯里化详解
Apr 29 Javascript
PHP捕捉异常中断的方法
Oct 24 Javascript
使用Ajax与服务器(JSON)通信实例
Nov 04 Javascript
react-native封装插件swiper的使用方法
Mar 20 Javascript
使用Vue制作图片轮播组件思路详解
Mar 21 Javascript
JQuery样式操作、click事件以及索引值-选项卡应用示例
May 14 jQuery
vscode 调试 node.js的方法步骤
Sep 15 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
非常经典的PHP文件上传类分享
2016/05/15 PHP
ThinkPHP类似AOP思想的参数验证的实现方法
2019/12/18 PHP
PHP7 标准库修改
2021/03/09 PHP
javascript 动态添加事件代码
2008/11/30 Javascript
javascript中获取下个月一号,是星期几
2012/06/01 Javascript
jquery图片放大功能简单实现
2013/08/01 Javascript
js在输入框屏蔽按键,只能键入数字的示例代码
2014/01/03 Javascript
jQuery scrollFix滚动定位插件
2015/04/01 Javascript
jquery关于事件冒泡和事件委托的技巧及阻止与允许事件冒泡的三种实现方法
2015/11/27 Javascript
Javascript实现通过选择周数显示开始日和结束日的实现代码
2016/05/30 Javascript
一个非常好用的文字滚动的案例,鼠标悬浮可暂停[两种方案任选]
2016/12/01 Javascript
javascript读取文本节点方法小结
2016/12/15 Javascript
vue2.0嵌套路由实现豆瓣电影分页功能(附demo)
2017/03/13 Javascript
JavaScript中Hoisting详解 (变量提升与函数声明提升)
2017/08/18 Javascript
js求数组中全部数字可拼接出的最大整数示例代码
2017/08/25 Javascript
vue-cli常用设置总结
2018/02/24 Javascript
vue element table 表格请求后台排序的方法
2018/09/28 Javascript
vue项目打包后上传至GitHub并实现github-pages的预览
2019/05/06 Javascript
[07:09]2014DOTA2国际邀请赛-Newbee再次发威成功晋级决赛
2014/07/19 DOTA
[01:28:44]DOTA2-DPC中国联赛定级赛 RNG vs iG BO3第一场 1月10日
2021/03/11 DOTA
Python操作SQLite简明教程
2014/07/10 Python
Python selenium 三种等待方式详解(必会)
2016/09/15 Python
利用python实现微信头像加红色数字功能
2018/03/26 Python
Pandas:DataFrame对象的基础操作方法
2018/06/07 Python
Python学习笔记之迭代器和生成器用法实例详解
2019/08/08 Python
Python K最近邻从原理到实现的方法
2019/08/15 Python
flask框架url与重定向操作实例详解
2020/01/25 Python
CSS3实现超酷的黑猫警长首页
2016/04/26 HTML / CSS
Dr. Martens马汀博士法国官网:马丁靴鼻祖
2020/01/15 全球购物
年度献血先进个人事迹材料
2014/02/14 职场文书
求职面试个人自我评价
2014/02/28 职场文书
作风转变心得体会
2014/09/02 职场文书
2015年酒店工作总结范文
2015/04/07 职场文书
2015年乡镇工作总结范文
2015/04/22 职场文书
离婚被告答辩状
2015/05/22 职场文书
冲出亚马逊观后感
2015/06/03 职场文书