当前位置: 首页 > 编程日记 > 正文

小程序:js获取验证码时(倒计时模块)

代码例子截图最近在上手开发小程序,发现其实小程序要比vue真的要简单太多了,有一套自己的html(WXML),css(WXSS),虽然有些标签不能直接沿用html5的标签来开发,不过内置的标签还是很好记也不多。今天在做公司的项目时,在做输入手机号码获取验证码这个模块功能时,突发奇想的想把这一功能写下来,虽然很简单但是为了以后不再花时间来重写,还是想写下来可以让一些刚刚入门小伙子们做个参考也好,哈!不多说直接看码:
<view> // 在小程序里,不在是div了<input bindinput="bindvalue" placeholder="输入手机号" /> // 这个直接用< button bindtap="verification">{{btntext}}</button>  //这个直接用
</view>  bindtap是小程序绑定单击事件,bindinput是小程序实时监听表单的值,接下来js部分要在同级同名目录下js文件里写。
const app = getApp()
Page({data:{phonecode: '', // 手机号btntext: '获取验证码'},bindvalue(event){ // 实时监听表单输入的值this.setData({phonecode:event.detail.value})},verification(){ // 点击获取验证码//这里是要调api接口的,我这里就假装已经调成功了,返回200了var _this = this if(json.code == 200){var coden = 60    // 定义60秒的倒计时var codeV = setInterval(function () {    _this.setData({    // _this这里的作用域不同了btntext: '重新获取' + (--coden) + 's'})if (coden == -1) {  // 清除setInterval倒计时,这里可以做很多操作,按钮变回原样等clearInterval(codeV)_this.setData({btntext: '获取验证码'})}}, 1000)  //  1000是1秒}}
})好了,一个简单的小程序的验证码获取例子就记录好了~复制代码


相关文章:

十大经典排序算法动画与解析,看我就够了

作者 | 程序员小吴转载自五分钟学算法&#xff08;ID: CXYxiaowu&#xff09;排序算法是《数据结构与算法》中最基本的算法之一。排序算法可以分为内部排序和外部排序。内部排序是数据记录在内存中进行排序。而外部排序是因排序的数据很大&#xff0c;一次不能容纳全部的排序记…

Crystal Reports 财务日记帐凭证套打设计

Crystal Reports 财务日记帐凭证套打设计 一、首先大家看下财务日记帐凭证的纸张格式&#xff1a; 下面我们来分析下有几点要素&#xff1a;1、每页显示5行记录&#xff0c;2、就是在合计处的中文金额大写了。其他页眉页脚在水晶报表中很容易设计。 二、报表设计&#xff1a;在…

oozie调度中的重试和手工rerun一个workflow

在oozie中有Bundle、Coordinator和Workflow三种类型的job&#xff0c;他们之间可以有以下包含关系。 Bundle > Coordinator > Workflow。 1. 重新运行一个Coordinator job&#xff0c;可以通过如下命令&#xff1a; oozie job -rerun 0000034-180116183039102-oozie-hado…

【Qt】在Qlayout中Qlabel::setScaledContents(true);失效

Qlabel中添加图片,并使图片自适应Qlabel的大小 QPixmap picture;picture.load("./1.jpg");ui->label->setScaledContents(true);//图片自适应label大小ui->label->setPixmap(picture); 在layout中Qlabel::setScaledContents(true);失效 解决办法,set…

JavaScript写XML

引用地址&#xff1a;http://zhidao.baidu.com/question/76344574.html?frala0 load 方法 作 用表示从指定位置加载的文件。 基本语法boolValue &#xff1d; xmlDocument.load(url);说 明url 包含要被加载档案的URL 的字符串。假如文件加载成功&#xff0c;传回值即为t…

在家想远程公司电脑?Python +微信一键连接

作者 | 阿文转载自 CSDN&#xff08;ID:CSDNnews&#xff09;有时候需要远程家里的台式机使用&#xff0c;因为我平时都是用 MAC 多&#xff0c;但是远程唤醒只能针对局域网&#xff0c;比较麻烦&#xff0c;于是我想用微信实现远程唤醒机器。准备工作本程序主要是实现远程管理…

Python 语法相关知识

系统相关的信息模块: import syssys.argv 是一个 list,包含所有的命令行参数. sys.stdout sys.stdin sys.stderr 分别表示标准输入输出,错误输出的文件对象. sys.stdin.readline() 从标准输入读一行 sys.stdout.write("a") 屏幕输出a sys.exit(exit_code) 退出程序 s…

【Qt】 error: LNK1107: 文件无效或损坏: 无法在 0x310 处读取

编译Qt程序使用动态库时&#xff0c;报错 error: LNK1107: 文件无效或损坏: 无法在 0x310 处读取 原因 链接时&#xff0c;使用的dll&#xff0c;而不是lib。 lib是编译时需要的&#xff0c;dll是运行时需要的。 windows下动态库和静态库 动态库&#xff1a;生成动态库时…

Red5安装与入门 与FMS配置

转自&#xff1a;http://www.rosoo.net/a/Media/Streaming/201010/10343.html red5安装时出现问题解决&#xff1a;http://www.cnblogs.com/phinecos/archive/2007/11/26/973109.htmlred5安装设置&#xff1a; 首先需要安装Red5运行所需的java研发环境jdk,我所有的文件都保存到…

面试必备|带你彻底搞懂Python生成器

2019年人工智能系统学&#xff1a; https://edu.csdn.net/topic/ai30?utm_sourceai100_bw 作者 | Rocky0429 转载自 Python空间&#xff08;ID:Devtogether&#xff09; 写在之前 Python 的高级语言特性一直是我们学习 Python 的一个难点&#xff0c;大部分人并没有做到熟练的…

Kubecon 2017大会Google高级产品经理David Aronchick访谈:机器学习和Kubernetes

\看新闻很累&#xff1f;看技术新闻更累&#xff1f;试试下载InfoQ手机客户端&#xff0c;每天上下班路上听新闻&#xff0c;有趣还有料&#xff01;\\\在德克萨斯州奥斯汀市举办的Kubecon大会已于近日闭幕&#xff0c;会议吸引了超过4000名工程师&#xff0c;Kubernetes成为了…

【Qt】Qt程序查看动态链接库(windows)

windows下使用dumpbin查看Qt程序运行时需要链接的动态库 打开终端 打开Qt自带的MSVC终端 如:Qt 5.10.0 64-bit forDesktop(MSVC 2017) 查看dumpbin命令 dumpbin微软官网说明 https://docs.microsoft.com/zh-cn/cpp/build/reference/dumpbin-options 直接输入命令dumpbin…

MSN 无法登录 错误代码 8007007e

故障原因&#xff1a; 发生这个错误的原因是一些朋友在网上下载了独立MSN提取包版本进行安装的&#xff0c;因为这个提取包只包含了Windows Live Messenger 2009&#xff0c;却缺少Windows Live Communications Platform&#xff0c;所以造成无法登录的问题。 解决办法&#xf…

你不知道的Vue响应式原理

文章首发于github Blog。 本文根据Vue源码v2.x进行分析。这里只梳理最源码中最主要的部分&#xff0c;略过非核心的一些部分。响应式更新主要涉及到Watcher&#xff0c;Dep&#xff0c;Observer这几个主要类。 本文主要弄清楚以下几个容易搞混的问题&#xff1a; Watcher&#…

优秀开发者必备技能包:Python调试器

作者 | Roky0429 来源 | Python空间&#xff08;ID:Devtogether&#xff09; 人工智能的现状及今后发展趋势如何&#xff1f; https://edu.csdn.net/topic/ai30?utm_sourcecsdn_bw 写在之前 不管是之前搞 acm 用 c/c 写算法还是后来用 Python 写代码&#xff0c;我发现在程…

【Qt】dumpbin详解

dumpbin简介 DUMPBIN是在Windows平台下用于显示COFF格式文件信息的一个命令行工具。你可以使用DUMPBIN去显示COFF格式的文件信息&#xff0c;比如像vc编译器生成的目标文件&#xff08;obj&#xff09;&#xff0c;可执行文件&#xff08;exe&#xff09;和动态链接库&#xf…

感悟Windows7

Win7已经逐渐在中国电脑用户中普遍起来&#xff0c;绝大多数人对其新增的功能很升级的功能都很是好评&#xff0c;接下来就将简略总结一下我对此系统使用的一些感想。 l 界面更加体现以人为本的思想。更加赏心悦目并且选择更加多元化。比如桌面小工具就有了更多的选择并且还可…

【Qt】Qt5在ubuntu16.04无法输入中文解决方式

参考博客 https://blog.csdn.net/linux_2016/article/details/52356576 博客中没有修改库的执行权限 解决方法 安装&#xff1a;fcitx-frontend-qt5 sudo apt-get install fcitx-frontend-qt5 拷贝动态库到Qt安装目录下的两个目录中 cp /usr/lib/x86_64-linux-gnu/qt5/p…

拿下中科大的计算机课程全靠它了!

整理 | 琥珀 出品 | AI科技大本营&#xff08;ID: rgznai100&#xff09; 人工智能的现状及今后发展趋势如何&#xff1f; https://edu.csdn.net/topic/ai30?utm_sourcecsdn_bw 中国科学技术大学&#xff0c;简称“中科大”&#xff0c;是国内有名的 985、211 重点高校。近年…

【阿里Q3财报:阿里云去年营收破百亿,亚洲市场遥遥领先】

2月1号晚间&#xff0c;阿里巴巴公布2018财年第三季度财报&#xff0c;阿里云保持持续强劲的增长&#xff0c;季度营收同比增长104%到35.99亿元。2017年累计营收突破百亿&#xff0c;达112亿&#xff0c;这是国内首次出现百亿规模的云计算服务商&#xff0c;在亚洲市场遥遥领先…

“神仙”打架,“凡人”遭殃

神仙是啥&#xff1f;古时神话时代举手翻江倒海的人物啊&#xff0c;那神仙打架是啥后果&#xff0c;相信大家心里都有个底吧。那现代社会的“神仙”是啥&#xff1f;那就是有钱有权的大人物或者商家&#xff0c;那真是让咱仰望的对象啊~ 话说最近这360跟QQ的巅峰对决&am…

120种小狗图像傻傻分不清?用fastai训练一个分类器

作者&#xff1a;一杯奶茶的功夫 链接&#xff1a;https://www.jianshu.com/p/ab35ed21df87 程序员转行学什么语言&#xff1f; https://edu.csdn.net/topic/ai30?utm_sourcecsdn_bw 这篇文章会讲解如何制作能够分类120种小狗的图像分类器。 这篇文章中所讲述的内容都是基于…

View_01_LayoutInflater的原理、使用方法

View_01_LayoutInflater的原理、使用方法 本篇博客是郭神博客Android视图状态及重绘流程分析&#xff0c;带你一步步深入了解View&#xff08;一&#xff09;的读书笔记的笔记。 LayoutInflater简单介绍 setContentView()内部是使用LayoutInflater来完毕载入布局的。setContent…

【ubuntu】在ubuntu下无法输出拼音输入法中的中括号“【” 和 “】”的解决方法

问题 在新装的ubuntu16.04中&#xff0c;打不出中括号【】&#xff0c;而变成 “”和“「” 解决方法 修改文件/usr/share/fcitx/data/punc.mb.zh_CN sudo vi /usr/share/fcitx/data/punc.mb.zh_CN将18、19行改为如下内容 18 [ 【 19 ] 】

配置数据源和分页

1.tomcat的版本&#xff0c;最好不要是安装版的&#xff0c;要解压缩的&#xff0c;不然无法连接数据源。2.conf》context.xml<Resource name"hotel" auth"Container" type"javax.sql.DataSource" driverClassName"oracle.jdbc.…

售价1万7的华为Mate X很贵吗?

整理 | 琥珀 出品 | AI科技大本营&#xff08;ID: rgznai100&#xff09; 60s测试&#xff1a;你是否适合转型人工智能&#xff1f; https://edu.csdn.net/topic/ai30?utm_sourcecxrs_bw 继三星之后&#xff0c;网友们期待已久的华为终于忍不住宣布了一系列重磅消息&#xff…

【C】数组数组初始化总结

C数组初始化总结 发现一个新方法&#xff0c;可以分段初始化数组 eg&#xff1a;int arrayC[MAX_LEN] {[1 … 5]9, [6 … 9] 8}; 代码如下 #include <stdio.h> #define MAX_LEN 10int main (int argc, char *argv[]) { //不初始化&#xff0c;参数值随机分配 //[0][0…

Golang的反射reflect深入理解和示例

[TOC] Golang的反射reflect深入理解和示例 【记录于2018年2月】 编程语言中反射的概念 在计算机科学领域&#xff0c;反射是指一类应用&#xff0c;它们能够自描述和自控制。也就是说&#xff0c;这类应用通过采用某种机制来实现对自己行为的描述&#xff08;self-representati…

如何读取多个文件,文件后缀名不一致,不过类似source.1 source.2 source.3等

#include <stdio.h> #include <stdlib.h> //为了使用exit() char *itoa(int num,char *str,int radix); int main() { int ch; FILE* fp; // char fname[50]"scan1.source.2100"; //用于存放文件名 char fname[20]"source."; …

AtCoder Petrozavodsk Contest 001

第一场apc&#xff0c;5H的持久战&#xff0c;我当然水几个题就睡了 A - Two Integers Time limit : 2sec / Memory limit : 256MB Score : 100 points Problem Statement You are given positive integers X and Y. If there exists a positive integer not greater than 1018…