微信小程序中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让setInteval里的函数参数中的this指向特定的对象
Jan 31 Javascript
JQuery 1.6发布 性能提升,同时包含大量破坏性变更
May 10 Javascript
javascript小组件 原生table排序表格脚本(兼容ie firefox opera chrome)
Jul 25 Javascript
浅析jQuery中常用的元素查找方法总结
Jul 04 Javascript
jquery幻灯片插件bxslider样式改进实例
Oct 15 Javascript
js跨域请求数据的3种常用的方法
Dec 01 Javascript
JS动态遍历json中所有键值对的方法(不知道属性名的情况)
Dec 28 Javascript
详解从Vue.js源码看异步更新DOM策略及nextTick
Oct 11 Javascript
如何用webpack4带你实现一个vue的打包的项目
Jun 20 Javascript
Vuejs 实现简易 todoList 功能 与 组件实例代码
Sep 10 Javascript
vue里的data要用return返回的原因浅析
May 28 Javascript
js+for循环实现字符串自动转义的代码(把后面的字符替换前面的字符)
Dec 24 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/05/21 PHP
php PDO属性设置与操作方法分析
2018/12/27 PHP
超级酷和最实用的jQuery实例收集(20个)
2010/04/21 Javascript
Script的加载方法小结
2011/01/12 Javascript
js如何获取file控件的完整路径具体实现代码
2013/05/15 Javascript
Javascript弹出窗口的各种方法总结
2013/11/11 Javascript
jquery-syntax动态语法着色示例代码
2014/05/14 Javascript
JS实现向表格中动态添加行的方法
2015/03/30 Javascript
javascript制作游戏开发碰撞检测的封装代码
2015/03/31 Javascript
jQuery插件imgPreviewQs实现上传图片预览
2016/01/15 Javascript
浅析jquery unbind()方法移除元素绑定的事件
2016/05/24 Javascript
jquery插件bootstrapValidator表单验证详解
2016/12/15 Javascript
JavaScript编程设计模式之观察者模式(Observer Pattern)实例详解
2017/10/25 Javascript
vue 权限认证token的实现方法
2018/07/17 Javascript
Layui给数据表格动态添加一行并跳转到添加行所在页的方法
2018/08/20 Javascript
vue实现局部刷新的实现示例
2019/04/16 Javascript
微信小程序image图片加载完成监听
2019/08/31 Javascript
three.js着色器材质的内置变量示例详解
2020/08/16 Javascript
Python爬虫抓取手机APP的传输数据
2016/01/22 Python
Python和Anaconda和Pycharm安装教程图文详解
2020/02/04 Python
Pytest参数化parametrize使用代码实例
2020/02/22 Python
Python操作MongoDb数据库流程详解
2020/03/05 Python
python开发实例之python使用Websocket库开发简单聊天工具实例详解(python+Websocket+JS)
2020/03/18 Python
PyCharm 在Windows的有用快捷键详解
2020/04/07 Python
在HTML5中使用MathML数学公式的简单讲解
2016/02/19 HTML / CSS
char型变量中能不能存贮一个中文汉字
2015/07/08 面试题
利用promise及参数解构封装ajax请求的方法
2021/03/24 Javascript
个人实用简单的自我评价
2013/10/19 职场文书
社区服务活动总结
2014/05/07 职场文书
群众路线剖析材料怎么写
2014/10/09 职场文书
2014年幼儿园工作总结
2014/11/10 职场文书
天鹅湖观后感
2015/06/09 职场文书
2016五一手机促销广告语
2016/01/28 职场文书
离婚协议书范文2016
2016/03/18 职场文书
2016年领导干部廉政承诺书
2016/03/24 职场文书
WINDOWS下安装mysql 8.x 的方法图文教程
2022/04/19 MySQL