0.前言
    本文主要说明如何使能或禁止表单控件。表单控件具有disabled属性，通过设置该属性可以禁止所有的input控件，input的更多属性请参考资料【1】。下面就通过一个简单的例子说明如何设置和读取disabled属性。

<!DOCTYPE html>

<html>

<head>

<script src="jquery.js"></script>

<meta charset="utf-8">

<title>测试disabled</title>

</head>

<body>

<div style="margin:0 auto; width:200px; text-align:center">

<p>

<input type="button" id="testButton" disabled="disabled" style="height:30px; font-size:20px" value="测试按钮">

</p>

</div>

</body>

</html>
【示例页面】
图1 一个“孤独”的按钮
1.HTML写法
    禁止某input控件。
     <input disabled="disabled">
    【注意】
    【1】disabled包含字母d
    【2】“disabled”而不是true或false。
 
2.javascript操作
    【读取】
    document.getElementById("testButton").disabled;
    返回结果禁止时为true，使能时为false。
    【设置】
 
    设置禁止为true，使能为false。
3.jquery操作
    【读取】
      $("#testButton").prop("disabled");
    返回结果禁止时为true，使能时为false。JQuery中prop函数设置表单空间属性。
    【设置】
     $("#testButton").prop("disabled", true);
    设置禁止为true，使能为false。
 

前端笔记——如何控制表单控件中的disabled的更多相关文章

  1. HTML5自学笔记[ 2 ]新增表单控件和表单属性

    新增<input>属性type="email",自动验证,若输入不为邮箱,则不能提交. 新增<input>属性type="tel",在移 ...

  2. Bootstrap系列 -- 18. 表单控件大小

    前面看到的表单控件都正常的大小.可以通过设置控件的height,line-height,padding和font-size等属性来实现控件的高度设置.不过Bootstrap框架还提供了两个不同的类名, ...

  3. Bootstrap_表单_表单控件

    一.输入框input 单行输入框,常见的文本输入框,也就是input的type属性值为text. 在Bootstrap中使用input时也必须添加type类型,如果没有指定type类型,将无法得到正确 ...

  4. Bootstrap关于表单控件（按扭）

    按钮也是表单重要控件之一,制作按钮通常使用下面代码来实现:   ☑  input[type=“submit”]   ☑  input[type=“button”]   ☑  input[type=“r ...

  5. Angular19 自定义表单控件

    1 需求 当开发者需要一个特定的表单控件时就需要自己开发一个和默认提供的表单控件用法相似的控件来作为表单控件:自定义的表单控件必须考虑模型和视图之间的数据怎么进行交互 2 官方文档 -> 点击前 ...

  6. Vue.js学习笔记——表单控件实践

    最近项目中使用了vue替代繁琐的jquery处理dom的数据更新,个人非常喜欢,所以就上官网小小地实践了一把. 以下为表单控件的实践,代码敬上,直接新建html文件,粘贴复制即可看到效果~ <! ...

  7. 前端 HTML body标签相关内容 常用标签 表单标签 form 表单控件分类

    表单控件分类 input标签: input标签 type属性的text,password,button按钮,submit按钮 input标签placeholder属性 标签上显示内容 input标签 ...

  8. Vue.js学习笔记 第七篇 表单控件绑定

    本篇主要说明表单控件的数据绑定,这次没有新的知识点 文本框 1.普通文本框 <div id="app-1"> <p><input v-model=&q ...

  9. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单：表单控件大小

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

随机推荐

  1. day3--深入学习命令总结

    1.查看命令帮助的几种方法 a.[命令] --help   适用于一般命令,非内置命令 b.man  [命令]     适用于一般命令,非内置命令 c.help  [命令]     适用于内置命令 d ...

  2. 全球领先的redis客户端：SFedis

    零.背景 这个客户端起源于我们一个系统的生产问题. 一.问题的发生 在我们的生产环境上发生了两次redis服务端连接数达到上限(我们配置的单节点连接数上限为8000)导致无法创建连接的情况.由于这个系 ...

  3. #UnityTips# 2017.11.14

    hi,all.最近比较忙,所以更新也比较慢了. 今天就来和大家分享一个小Tip,它是关于UGUI的坑的. 使用过UGUI的朋友们都知道,Canvas的渲染方式有三种: Screen Space Ove ...

  4. Mybatis面试整理

    #{}和${}的区别 #{}是预编译处理,${}是字符串替换. Mybatis在处理#{}时,会将sql中的#{}替换为?号,调用PreparedStatement的set方法来赋值: Mybatis ...

  5. java Log4j日志配置详解大全

    一.Log4j简介 Log4j有三个主要的组件:Loggers(记录器),Appenders (输出源)和Layouts(布局).这里可简单理解为日志类别,日志要输出的地方和日志以何种形式输出.综合使 ...

  6. 聊下 git 多账户问题

    git 多账户问题 标签(空格分隔):git github gitlab git多账户 背景 git 多账号配置 ssh 多密钥对配置 背景 在使用 git 的时候我们都会面临多账户问题,比较常见的就 ...

  7. Python [习题] 文件操作：目录间copy 文件

    [习题] 指定一个源文件,实现copy到目标目录.例如把/tmp/sample1.txt 拷贝到/tmp/sample2.txt原文件需要有读权限(默认rt权限),目标文件需要给写(w即可)权限. I ...

  8. pyqt5实现注册界面

    __author__ = 'sign_in' import sys from PyQt5.QtGui import QPixmap from PyQt5.QtWidgets import * clas ...

  9. 微信小程序支付及退款流程详解

    微信小程序的支付和退款流程 近期在做微信小程序时,涉及到了小程序的支付和退款流程,所以也大概的将这方面的东西看了一个遍,就在这篇博客里总结一下. 首先说明一下,微信小程序支付的主要逻辑集中在后端,前端 ...

  10. 五、Hadoop学习笔记————调优之硬件选择

    ResourceManageer服务器需要选择性能较好的 若有1TB数据,每天增量为10GB,则需要预留17.8TB,*3是因为有三分备份,*1.3是因为还需要预留出空间给操作系统等等 若集群在三十台 ...