微信小程序中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 相关文章推荐
iframe自适应宽度、高度 ie6 7 8,firefox 3.86下测试通过
Jul 29 Javascript
Jquery each方法跳出循环,并获取返回值(实例讲解)
Dec 12 Javascript
js实现省市联动效果的简单实例
Feb 10 Javascript
Bootstrap表单布局样式代码
May 31 Javascript
基于VUE选择上传图片并页面显示(图片可删除)
May 25 Javascript
JQuery 获取Dom元素的实例讲解
Jul 08 jQuery
JavaScript实现的原生态兼容IE6可调可控滚动文字功能详解
Sep 19 Javascript
浅谈Vue SSR 的 Cookies 问题
Nov 20 Javascript
JS实现百度网盘任意文件强制下载功能
Aug 31 Javascript
Vue 中使用富文本编译器wangEditor3的方法
Sep 26 Javascript
js实现图片上传即时显示效果
Sep 30 Javascript
vue cli3适配所有端方案的实现
Apr 13 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生成加减算法方式的验证码实例
2018/03/12 PHP
颜色选择器 Color Picker,IE,Firefox,Opera,Safar
2010/11/25 Javascript
YUI模块开发原理详解
2013/11/18 Javascript
Eclipse引入jquery报错如何解决
2015/12/01 Javascript
谈一谈javascript中继承的多种方式
2016/02/19 Javascript
快速使用Bootstrap搭建传送带
2016/05/06 Javascript
浅析jQuery 遍历函数,javascript中的each遍历
2016/05/25 Javascript
jquery ajax后台返回list,前台用jquery遍历list的实现
2016/10/30 Javascript
利用Vue.js实现checkbox的全选反选效果
2017/01/18 Javascript
NodeJs模拟登陆正方教务
2017/04/28 NodeJs
微信小程序 页面跳转传值实现代码
2017/07/27 Javascript
AngularJS中的路由使用及实现代码
2017/10/09 Javascript
vue项目中公用footer组件底部位置的适配问题
2018/05/10 Javascript
浅谈webpack 构建性能优化策略小结
2018/06/13 Javascript
vue + webpack如何绕过QQ音乐接口对host的验证详解
2018/07/01 Javascript
AngularJS中ng-options实现下拉列表的数据绑定方法
2018/08/13 Javascript
[06:07]DOTA2-DPC中国联赛3月5日Recap集锦
2021/03/11 DOTA
用Python的urllib库提交WEB表单
2009/02/24 Python
Python中Continue语句的用法的举例详解
2015/05/14 Python
Python中音频处理库pydub的使用教程
2017/06/07 Python
使用django-crontab实现定时任务的示例
2018/02/26 Python
Python聊天室程序(基础版)
2018/04/01 Python
Python实现Dijkstra算法
2018/10/17 Python
pyqt5利用pyqtDesigner实现登录界面
2019/03/28 Python
Python OS模块实例详解
2019/04/15 Python
Python turtle绘画象棋棋盘
2019/08/21 Python
python pyenv多版本管理工具的使用
2019/12/23 Python
python @propert装饰器使用方法原理解析
2019/12/25 Python
html5 application cache遇到的严重问题
2012/12/26 HTML / CSS
html5 横向滑动导航栏的方法示例
2020/05/08 HTML / CSS
家长对孩子评语
2014/01/30 职场文书
业绩考核岗位职责
2014/02/01 职场文书
《雨霖铃》教学反思
2014/02/22 职场文书
元宵节晚会主持词
2015/07/01 职场文书
天气温馨提示语
2015/07/14 职场文书
感恩父母主题班会
2015/08/12 职场文书