微信小程序事件 bindtap bindinput代码实例


Posted in Javascript onAugust 26, 2019

一、bindtap事件

在wxml文件里绑定:

<view class='wel-list' bindtap='TZdown'>
  <image src="/images/welcome_08.png"></image>
  <text>C语言资料下载</text>
 </view>

在js文件里相应:

Page({
 TZdown: function () {
  wx.navigateTo({
   url: '../download/download'
  });
 }
})

二、bindinput事件

wxml文件:

<input type="number" placeholder="请输入手机号" class="inp-holder" maxlength="11" bindinput="getPhone" />
<input type="number" placeholder="请输入验证码" class="inp-holder" maxlength="6" bindinput="getCode" />

js文件:

// 拿到手机号
  getPhone: function (e) {
    var val = e.detail.value;
    this.setData({
      telphone: val
    });
  },  
   // 拿到验证码
  getCode: function (e) {
    var val = e.detail.value;
    this.setData({
      code: val
    });
  },

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript 事件对象的实现
Jul 13 Javascript
defer属性导致引用JQuery的页面报“浏览器无法打开网站xxx,操作被中止”错误的解决方法
Apr 27 Javascript
js文本框输入点回车触发确定兼容IE、FF等
Nov 19 Javascript
BootStrap 图标icon符号图标glyphicons不正常显示的快速解决办法
Dec 08 Javascript
node.js报错:Cannot find module 'ejs'的解决办法
Dec 14 Javascript
从零学习node.js之mysql数据库的操作(五)
Feb 24 Javascript
JS实现直接运行html代码的方法
Mar 13 Javascript
React中上传图片到七牛的示例代码
Oct 10 Javascript
原生JS实现小小的音乐播放器
Oct 16 Javascript
一次记住JavaScript的6个正则表达式方法
Feb 22 Javascript
通过实例了解JS执行上下文运行原理
Jun 17 Javascript
在Vue中使用CSS3实现内容无缝滚动的示例代码
Nov 27 Vue.js
详解在vue-cli3.0中自定css、js和图片的打包路径
Aug 26 #Javascript
微信小程序实现手势滑动效果
Aug 26 #Javascript
详解nuxt 微信公众号支付遇到的问题与解决
Aug 26 #Javascript
Vue路由之JWT身份认证的实现方法
Aug 26 #Javascript
Vue中跨域及打包部署到nginx跨域设置方法
Aug 26 #Javascript
js实现跟随鼠标移动的小球
Aug 26 #Javascript
vue 源码解析之虚拟Dom-render
Aug 26 #Javascript
You might like
php url地址栏传中文乱码解决方法集合
2010/06/25 PHP
php获取错误信息的方法
2015/07/17 PHP
php验证码生成代码
2015/11/11 PHP
ThinkPHP中create()方法自动验证表单信息
2017/04/28 PHP
php验证码生成器
2017/05/24 PHP
JQuery-tableDnD 拖拽的基本使用介绍
2013/07/04 Javascript
遍历DOM对象内的元素属性示例代码
2014/02/08 Javascript
JavaScript的Date()方法使用详解
2015/06/09 Javascript
浅谈javascript原型链与继承
2015/07/13 Javascript
JS实现的仿东京商城菜单、仿Win右键菜单及仿淘宝TAB特效合集
2015/09/28 Javascript
详解Bootstrap按钮
2016/01/04 Javascript
微信小程序 欢迎界面开发的实例详解
2016/11/30 Javascript
ES6新特性之Object的变化分析
2017/03/31 Javascript
详解vue-router基本使用
2017/04/18 Javascript
javascript编写简易计算器
2017/05/06 Javascript
IScroll那些事_当内容不足时下拉刷新的解决方法
2017/07/18 Javascript
Bootstrap实现的表格合并单元格示例
2018/02/06 Javascript
Node.js fs模块原理及常见用途
2020/10/22 Javascript
[12:29]《一刀刀一天》之DOTA全时刻19:蝙蝠骑士田伯光再度不举
2014/06/10 DOTA
使用python itchat包爬取微信好友头像形成矩形头像集的方法
2019/02/21 Python
python设置环境变量的原因和方法
2019/06/24 Python
Django的Modelforms用法简介
2019/07/27 Python
为什么称python为胶水语言
2020/06/16 Python
西班牙灯具网上商店:Lampara.es
2018/06/05 全球购物
香蕉共和国加拿大官网:Banana Republic加拿大
2018/08/06 全球购物
一些网络技术方面的面试题
2014/05/01 面试题
什么是用户模式(User Mode)与内核模式(Kernel Mode) ?
2015/09/07 面试题
中药学专业求职信
2014/05/31 职场文书
给女朋友道歉的话大全
2015/01/20 职场文书
恋恋笔记本观后感
2015/06/16 职场文书
开业庆典致辞
2015/08/01 职场文书
如何书写读后感?(附范文)
2019/07/26 职场文书
教你快速开启Apache SkyWalking的自监控
2021/04/25 Servers
python开发人人对战的五子棋小游戏
2022/05/02 Python
Django框架中模型的用法
2022/06/10 Python
table设置超出部分隐藏,鼠标移上去显示全部内容的方法
2022/12/24 HTML / CSS