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开始 另外没有从小到大, 没观察室哪个 ...
随机推荐
- 推荐一波微软家的浏览器:EDGE
前段时间英雄联盟(LOL)队伍 EDG 夺冠成为热门事件,上了各大热搜,即使大家不玩英雄联盟,相信也多多少少有听说相关信息吧! 今天我们的主角并不是 EDG,而是微软的新版浏览器 EDGE !!! 微 ...
- WPF/C#:如何显示具有层级关系的数据
前言 比方说我们有以下两个类: public class Class { public string? Name { get; set; } public List<Student>? S ...
- 剑指offer004(Java)-只出现一次的数字(中等)
题目: 给你一个整数数组 nums ,除某个元素仅出现 一次 外,其余每个元素都恰出现 三次 .请你找出并返回那个只出现了一次的元素. 示例1: 输入:nums = [2,2,3,2] 输出:3 示例 ...
- 【pytorch学习】之自动微分
5 自动微分 求导是几乎所有深度学习优化算法的关键步骤.虽然求导的计算很简单,只需要一些基本的微积分.但对于复杂的模型,手工进行更新是一件很痛苦的事情(而且经常容易出错).深度学习框架通过自动计算导数 ...
- 问题排查不再愁,Nacos 上线推送轨迹功能
简介: 微服务体系下,注册中心的调用和配置变更是家常便饭,例如阿里每天就有百万级变更.亿级推送.可是,一旦出现调用或配置异常,问题排查就成了用户最大的困惑:是注册和配置中心导致的,还是上下游业务自身的 ...
- 阿里云EMAS旗下低代码平台Mobi开放定向内测
简介:[低代码深度共创]EMAS旗下低代码平台Mobi开放定向内测名额,限时限量,参与调研先到先得! Mobi是面向全端(Web.Native App.H5.全平台小程序等)场景,模型驱动的低代码开 ...
- Redis消息队列发展历程
简介:Redis是目前最受欢迎的kv类数据库,当然它的功能越来越多,早已不限定在kv场景,消息队列就是Redis中一个重要的功能.Redis从2010年发布1.0版本就具备一个消息队列的雏形,随着1 ...
- 龙蜥利器:系统运维工具 SysAK的云上应用性能诊断 | 龙蜥技术
简介:本文从大量的性能诊断实践出发,来介绍 SysAK 在性能诊断上的方法论及相关工具. 文/张毅:系统运维SIG核心成员.SysAK 项目负责人:毛文安:系统运维 SIG 负责人. 系统运维既 ...
- 【阿里云 CDP 公开课】 第二讲:CDH/HDP 何去何从
简介:Hadoop社区版CDH/HDP已经不再更新,也将终止服务.后续的平台路线图怎么规划?Cloudera CDP整合了CDH和HDP,有哪些性能提升和功能增强?如何平滑的进行迁移?本文结合CDH ...
- [FAQ] 部署二进制运行时 go-ego/gse 如何正确加载分词字典
运行Golang编译后二进制运行时,此时运行二进制时所在目录就是Golang源码程序认为的根目录了. 所以只需要把字典文件拷贝到与二进制所在同一目录内,然后使用 seg.LoadDict('dicti ...