我们在开发中难免会遇到一些登录注册输入框中的值为空时,按钮的状态变成为不可点击的状态,当输入框有值后就把按钮变为可点击的状态

代码部分:

<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 输入有值后按钮变色的更多相关文章

  1. asp.net 的那点事(1、当用户在浏览器地址栏输入了网址后,发生了什么?)

    从今天开始我将抽出空闲时间复习asp.net相关知识.此篇博文只是为了记录学习当中的知识点和感觉到比较重要的知识点. 本人才疏学浅,如有遗漏或者错误希望广大博友尽情拍砖.我会在后续中进行更正. 这个问 ...

  2. 网易笔试题:浏览器中输入一个url后回车到返回页面信息的过程

    You enter a URL into the browser输入一个url地址 The browser looks up the IP address for the domain name浏览器 ...

  3. elementUi中input输入字符光标在输入一个字符后,光标失去焦点

    elementUi中input输入字符光标在输入一个字符后,光标就退出,无法输入需要再次聚焦然后输入一个字符又再次退出 首先,用elementUi正常用v-model绑定输入的值是不会造成光标退出的, ...

  4. easyui中combobox 验证输入的值必须为选项框中的数据

    当作为提示框的方式时,combobox必须设置为允许用户输入的模式,但是当用户输入后未选择正确的数据就直接按tab或点击鼠标离开控件会导致用户输入无效的值并且通过验证,为了避免这种情况的发生我们需要对 ...

  5. Java Scanner 类,获取用户输入的值

    Scanner 类使用步骤 1.导入java.util.Scanner import java.util.Scanner; 2.创建Scanner对象 Scanner scan = new Scann ...

  6. Javascript对checkbox勾选判断,错误提示和按钮变色操作

    同意相关条款未打钩时,登录按钮为灰色且无法提交,点击灰色的登录按钮提示同意相关条款,打钩后变成亮色且可以提交信息. 勾选框及文字: <div class="check-rule&quo ...

  7. js中表单提交后按钮变灰色的功能

    表单提交后按钮变成灰色 http://www.111cn.net/wy/js-ajax/45299.htm

  8. c# winform动态生成控件与获取动态控件输入的值

    差不多有2年没有写winform程序,一直都是写bs.最近项目需要,又开始着手写一个小功能的winform程序,需要动态获取xml文件的节点个数,生成跟节点个数一样的textbox, 最后还要获取操作 ...

  9. iOS 身份证最后一位是X,输入17位后自动补全X(转)

    非原创,转载自http://blog.csdn.net/l2i2j2/article/details/51542028如果身份证最后一位是X,输入17位后自动补全X// textField代理方法 - ...

  10. YII2 用 in查询的时候出现无结果, 删除某些值后查询有结果 提前sort数组即可

    YII2 用 in查询的时候出现无结果, 删除某些值后查询有结果, 在数组前用了一个 array_merge 合并了2个数组. 排查发现是 数组中键值没有挨着从0开始 另外没有从小到大, 没观察室哪个 ...

随机推荐

  1. leetcode每日一题:409. 最长回文串

    409. 最长回文串 给定一个包含大写字母和小写字母的字符串,找到通过这些字母构造成的最长的回文串. 在构造过程中,请注意区分大小写.比如 "Aa" 不能当做一个回文字符串. 注意 ...

  2. PyTorch分分钟快速安装

    PyTorch的前身是Torch,其底层和Torch框架一样,但是使用Python重新写了很多内容,不仅更加灵活,支持动态图,而且提供了Python接口. 它是由Torch7团队开发,是一个以Pyth ...

  3. 利用navicat 完成两台服务器之间的数据库迁移,安全可靠

    首先,准备工作先做好 1. 工具,navicat,我这里用的是navicat12+ 2. 建立两台服务器的链接,即新建链接,mysql,同时,需要在迁移目标服务器上面实现建立好对应的数据库,即如果有1 ...

  4. 向量数据库之Lancedb学习记录

    简介 Lancedb是一个用于人工智能的开源矢量数据库,旨在存储.管理.查询和检索大规模多模式数据的嵌入.Lancedb的核心是用Rust编写的,并构建在Lance之上,专为高性能 ML 工作负载和快 ...

  5. 力扣574(MySQL)-当选者(中等)

    题目: 表: Candidate 表: Vote id 是自动递增的主键,CandidateId 是 Candidate 表中的 id. 问题:请编写 sql 语句来找到当选者的名字,上面的例子将返回 ...

  6. 零信任策略下K8s安全监控最佳实践(K+)

    简介: 本文重点将围绕监控防护展开,逐层递进地介绍如何在复杂的分布式容器化环境中借助可观测性平台,持续监控K8s集群,及时发现异常的 API 访问事件.异常流量.异常配置.异常日志等行为,并且结合合理 ...

  7. WPF 对接 Vortice 调用 WIC 加载图片

    本文将告诉大家如何通过 Vortice 库从底层的方式使用 WIC 层加载本地图片文件,解码为 IWICBitmap 图片,然后将 IWICBitmap 图片交给 WPF 进行渲染 本文的前置博客:W ...

  8. dotnet 在 UOS 国产系统上使用 MonoDevelop 创建 GTK 全平台带界面应用

    本文告诉大家如何在 UOS 国产系统上开始使用 MonoDevelop 开发,通过创建 GTK# 应用,进入界面开发的第一步 在开始之前需要小伙伴先安装好 MonoDevelop 工具 安装完成之后, ...

  9. xtrabackup备份恢复

    tar -xzvf percona-xtrabackup-2.1.9-744-Linux-x86_64.tar.gz cd percona-xtrabackup-2.1.9-Linux-x86_64/ ...

  10. SpringBoot配置两个一样的Bean,区分两个配置类——@Primary

    1.@Primary 作用: 指定默认bean. 当没有根据名字显示要注入哪个bean的时候,默认使用打了@Primary标签的bean 2.配置两个一样的bean @Configuration pu ...