input禁止输入

本文详细介绍了如何通过HTML和CSS实现input元素的禁用和禁止输入功能,包括使用`disabled`属性禁用、`readonly`属性设置只读,以及利用`onfocus`和`maxlength`属性限制输入。实例代码展示了各种表单控件的使用方法。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

input标签禁止输入的方法:

  1.   添加   οnfοcus="this.blur()"  使元素失去焦点  
  2.   将属性   maxlength  的值设为 0  

例如:<input type="number" name="" id="" max="10" min="1" οnfοcus="this.blur()">

例如:<input type="text" maxlength="0">

input标签禁用的方法:

  1.   添加   disabled    禁用属性  
  2.   添加   readonly    只读属性  

注意:“禁用” 和 “禁止输入” 是有区别的,禁用会使input自带的功能丧失,标签呈灰色状态。而禁止输入仍能保持原有功能

 

 注意:下方是源代码,可直接复制

<form action="">

    <input type="text" placeholder="输入用户名" value="" maxlength="4">

    <input type="password" name="" id=""maxlength="6">

    <br>

    <input type="radio" name="chgo" id="">yes

    <input type="radio" name="chgo" id="">no

    <br>

    <input type="checkbox" name="cheeses" id="">one

    <input type="checkbox" name="cheeses" id="">two

    <input type="checkbox" name="cheeses" id="">three

    <input type="file" name="" id="" multiple>

    <input type="submit" value="register">

    <input type="reset" value="reset">

    <input type="button" value="button">

    <button>button</button>

    <input type="number" name="" id="" max="10" min="1" οnfοcus="this.blur()">

    <input type="range" max="20" min="0" value="20">

    <input type="color" name="" id="">

    <input type="date">

    <br>

    <input type="checkbox" name="" id="kikout">

    <label for="kikout">打钩</label>

    <select multiple>

      <option value="">one</option>

      <option value="">two</option>

      <option value="">three</option>

    </select>

    <textarea style="resize: none;"></textarea>

  </form>

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值