vue项目中input框不允许输入 必须通过选项选择的几种方式 您所在的位置:网站首页 input不允许输入空格后无法输入中文 vue项目中input框不允许输入 必须通过选项选择的几种方式

vue项目中input框不允许输入 必须通过选项选择的几种方式

2024-07-14 01:21| 来源: 网络整理| 查看: 265

vue项目中input框不允许输入 必须通过选项选择的几种方式 1: readonly属性

定义和用法

readonly 属性规定输入字段为只读。

只读字段是不能修改的。不过,用户仍然可以使用 tab 键切换到该字段,还可以选中或拷贝其文本。

readonly 属性可以防止用户对值进行修改,直到满足某些条件为止(比如选中了一个复选框)。然后,需要使用 JavaScript 消除 readonly 值,将输入字段切换到可编辑状态。

readonly 属性可与 或 配合使用。

2:disabled禁用

2:disabled 被禁用的 input 元素可复制,不能接收焦点,设置后文字的颜色会变成灰色。无法与 一起使用。

使用b-bind单向绑定

readonly和disabled区别

区别: (1) 表面上可看到的区别就是当这两个词都设置为true时,都为禁用状态,当鼠标移上时使用disable的相关控件时鼠标出现禁用样式,并且不可做任何操作,而Readonly还可以获取文本框里的焦点。 (2) Disable比readonly的使用范围比广,适用文本框、文本域、下拉框、button按钮、单选框…….而readonly只适用于input(text、passwork、textarea)。 (3) Disable设置为true之后是不可以向后台提交数据的,此时可以选择改用readonly进行禁用,或者在提交数据时取消禁用。

3:通过控制input的max length为0实现 4:失去焦点

4:οnfοcus="this.blur();“onfocuse是聚焦的意思,当你把光标放在文本框上输入的时候,就是聚焦,但这里添加了"this.blur()”,blur的作用就是去除聚焦,也就是你不能把光标放在这个文本框上,换句话说就是你不能输入文本了



【本文地址】

公司简介

联系我们

今日新闻

    推荐新闻

    专题文章
      CopyRight 2018-2019 实验室设备网 版权所有