uniapp 输入有值后按钮变色
我们在开发中难免会遇到一些登录注册输入框中的值为空时,按钮的状态变成为不可点击的状态,当输入框有值后就把按钮变为可点击的状态
代码部分:
<input placeholder="请输入手机号" name="input" type="number" v-model="phone" @input="changeDisabled"></input>@input: 输入框输入的实时监听
<button class="bg-blue text-center login_btn" :disabled="disabled">登录</button>
data() {
return {
disabled: true
}
}
changeDisabled(e) {
// console.log(e)
if (e.detail.value != "") {
this.disabled = false;
} else {
this.disabled = true;
}
},
效果图:

有值后:

uniapp 输入有值后按钮变色的更多相关文章
- asp.net 的那点事(1、当用户在浏览器地址栏输入了网址后,发生了什么?)
从今天开始我将抽出空闲时间复习asp.net相关知识.此篇博文只是为了记录学习当中的知识点和感觉到比较重要的知识点. 本人才疏学浅,如有遗漏或者错误希望广大博友尽情拍砖.我会在后续中进行更正. 这个问 ...
- 网易笔试题:浏览器中输入一个url后回车到返回页面信息的过程
You enter a URL into the browser输入一个url地址 The browser looks up the IP address for the domain name浏览器 ...
- elementUi中input输入字符光标在输入一个字符后,光标失去焦点
elementUi中input输入字符光标在输入一个字符后,光标就退出,无法输入需要再次聚焦然后输入一个字符又再次退出 首先,用elementUi正常用v-model绑定输入的值是不会造成光标退出的, ...
- easyui中combobox 验证输入的值必须为选项框中的数据
当作为提示框的方式时,combobox必须设置为允许用户输入的模式,但是当用户输入后未选择正确的数据就直接按tab或点击鼠标离开控件会导致用户输入无效的值并且通过验证,为了避免这种情况的发生我们需要对 ...
- Java Scanner 类,获取用户输入的值
Scanner 类使用步骤 1.导入java.util.Scanner import java.util.Scanner; 2.创建Scanner对象 Scanner scan = new Scann ...
- Javascript对checkbox勾选判断,错误提示和按钮变色操作
同意相关条款未打钩时,登录按钮为灰色且无法提交,点击灰色的登录按钮提示同意相关条款,打钩后变成亮色且可以提交信息. 勾选框及文字: <div class="check-rule&quo ...
- js中表单提交后按钮变灰色的功能
表单提交后按钮变成灰色 http://www.111cn.net/wy/js-ajax/45299.htm
- c# winform动态生成控件与获取动态控件输入的值
差不多有2年没有写winform程序,一直都是写bs.最近项目需要,又开始着手写一个小功能的winform程序,需要动态获取xml文件的节点个数,生成跟节点个数一样的textbox, 最后还要获取操作 ...
- iOS 身份证最后一位是X,输入17位后自动补全X(转)
非原创,转载自http://blog.csdn.net/l2i2j2/article/details/51542028如果身份证最后一位是X,输入17位后自动补全X// textField代理方法 - ...
- YII2 用 in查询的时候出现无结果, 删除某些值后查询有结果 提前sort数组即可
YII2 用 in查询的时候出现无结果, 删除某些值后查询有结果, 在数组前用了一个 array_merge 合并了2个数组. 排查发现是 数组中键值没有挨着从0开始 另外没有从小到大, 没观察室哪个 ...
随机推荐
- 深度解读《深度探索C++对象模型》之默认构造函数
接下来我将持续更新"深度解读<深度探索C++对象模型>"系列,敬请期待,欢迎关注!也可以关注公众号:iShare爱分享,主动获得推文. 提到默认构造函数,很多文章和书籍 ...
- 基于 Flink SQL 构建流批一体的 ETL 数据集成
简介: 如何利用 Flink SQL 构建流批一体的 ETL 数据集成. 本文整理自云邪.雪尽在 Flink Forward Asia 2020 的分享,该分享以 4 个章节来详细介绍如何利用 Fli ...
- 重温设计模式之 Factory
简介: 创建型模式的核心干将,工厂.简单工厂.抽象工厂,还记得清么,一文回顾和对比下. 作者 | 弥高来源 | 阿里技术公众号 前言 创建型模式的核心干将,工厂.简单工厂.抽象工厂,还记得清么,一文回 ...
- [FAQ] 你所看过的 APP 流氓提示语有哪些
分享案例来自产品:网抑云. 当你要进行一些常规操作,比如评论时,进行弹窗伺候: |----------------------| | | | 为提高您的账号安全性,请先绑定手机号 ...
- 2019-8-31-dotnet-动态代理魔法书
title author date CreateTime categories dotnet 动态代理魔法书 lindexi 2019-08-31 16:55:58 +0800 2019-06-02 ...
- VGA显示图片
VGA显示图片 1. VGA显示图片的原理 图片比之前显示的色块和字符的数据量大,所以使用rom来存储图片.用到ROM IP.可以存放mif和hex格式,需要先把图片转换成mif格式. 2. 如何制作 ...
- 02 Orcad设计环境讲解与工程创建
02 Orcad设计环境讲解与工程创建 学习目标: 1) 掌握Orcad软件绘制元件库以及原理图的方法: 2) 掌握Allegro软件绘制PCB库以及PCB的方法: 3) 掌握Orca ...
- 笔记04_正确使用Heterogeneous元件
笔记04_正确使用Heterogeneous元件 1.出现错误的原因,就是一个元件的几个 部分没有分组.比如上一节创建的NE5532_HETE,当这个元件被调用两次或更多次时,存在若干个A,B部分,如 ...
- WebSocket集群分布式改造:实现多人在线聊天室
前言 书接上文,我们开始对我们的小小聊天室进行集群化改造. 上文地址: [WebSocket入门]手把手搭建WebSocket多人在线聊天室(SpringBoot+WebSocket) 本文内容摘要: ...
- 新闻网页Python爬虫(jieba分词+关键词搜索排序)
前言 最近做了一个python3作业题目,涉及到: 网页爬虫 网页中文文字提取 建立文字索引 关键词搜索 涉及到的库有: 爬虫库:requests 解析库:xpath 正则:re 分词库:jieba ...