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. winform音频播放器(有声小说[凡人修仙传])

    该程序采用多线程的技术及DataGridView单元格扩展的技术 1.获取下载列表 private void GetDownList() { //System.Web.HttpUtility.UrlD ...

  2. Hibernate开发文档

    hibernate配置 映射约束文件 <!DOCTYPE hibernate-mapping PUBLIC "-//Hibernate/Hibernate Mapping DTD 3. ...

  3. 搭建公司内部的NuGet服务器

    1.  创建NuGet项目      (注意:解决方案名称可以自定义为其他的名称)        2.   安装NuGet Server       在 “NuGetServer” 项目上,右键选择 ...

  4. 史上最全的IntelliJIdea快捷键

    Ctrl+Shift+方向键Up/Down 代码向上/下移动. Ctrl+X 删除行 Ctrl+Y 也是删除行,不知道有啥区别 Ctrl+D 复制行 Ctrl+Alt+L 格式化代码 Ctrl+N 查 ...

  5. ANDROID基础ACTIVITY篇之Activity的加载模式

    在这之前首先让我们先了解一下什么是Task Task,简单的说,就是一组以栈的模式聚集在一起的Activity组件集合.它们有潜在的前后驱关联,新加入的Activity组件,位于栈顶,并仅有在栈顶的A ...

  6. Logger.getLogger和 LogFactory.getLog

    Logger.getLogger和 LogFactory.getLog Logger.getLogger LogFactory.getLogLogger来自log4j自己的包.如果用Logger.ge ...

  7. SQL语言（二） java怎样连接操作数据库中的数据

    import java.sql.Connection;import java.sql.DriverManager;import java.sql.ResultSet;import java.sql.S ...

  8. margin、padding单位百分比

    年前做了一个测试题 https://www.wenjuan.com/s/VjaEva/,里面有一道题目涉及到了margin和padding单位为百分比的情况.写出来记录一下以防止自己忘记. <! ...

  9. 爬起点小说day03

    # 把所有类别的前3页的小说爬取下来 import scrapyfrom scrapy.http import Requestfrom time import sleepfrom qidianNove ...

  10. chromium源码阅读--HTTP Cache

    最近积累了一些关于HTTP缓存的知识,因此结合Chromium的实现总结一下,主要从如下2个分面: 1.HTTP缓存的基础知识 2.Chromium关于HTTP缓存的实现分析 一.HTTP缓存的基础知 ...