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. Ubuntu 12.04嵌入式交叉编译环境arm-linux-gcc搭建过程

    Ubuntu 12.04嵌入式交叉编译环境arm-linux-gcc搭建过程Linux版本:Ubuntu 12.04 内核版本:Linux 3.5.0 交叉编译器版本:arm-linux-gcc-4. ...

  2. HBase流量限制和表负载均衡剖析

    1.概述 在HBase-1.1.0之前,HBase集群中资源都是全量的.用户.表这些都是没有限制的,看似完美实则隐患较大.今天,笔者就给大家剖析一下HBase的流量限制和表的负载均衡. 2.内容 也许 ...

  3. mac中利用brew实现多版本php共存以及任意切换

    1.安装brew 参考链接:https://brew.sh/index_zh-cn.html 2.安装php56 brew install homebrew/php/php56 3.配置php56 因 ...

  4. 在C#中interface与abstract class的区别

    1)在继承抽象类时,必须覆盖该类中的每一个抽象方法,而每个已实现的方法必须和抽象类中指定的方法一样,接收相同数目和类型的参数,具有同样的返回值,这一点与接口相同. 2)当父类已有实际功能的方法时,该方 ...

  5. 用C#实现DES加密解密解决URL参数明文的问题

    啥也不说,直接上代码. 加密解码,封装到一个类,key可以自己修改. using System; using System.Security.Cryptography; using System.Te ...

  6. [转载] 基于Redis实现分布式消息队列

    转载自http://www.linuxidc.com/Linux/2015-05/117661.htm 1.为什么需要消息队列?当系统中出现“生产“和“消费“的速度或稳定性等因素不一致的时候,就需要消 ...

  7. 【Java入门提高篇】Day1 抽象类

    基础部分内容差不多讲解完了,今天开始进入Java提高篇部分,这部分内容会比之前的内容复杂很多,希望大家做好心理准备,看不懂的部分可以多看两遍,仍不理解的部分那一定是我讲的不够生动,记得留言提醒我. 好 ...

  8. Cngigure和BUS实现远端配置

    1 server依赖 <?xml version="1.0" encoding="UTF-8"?><project xmlns="h ...

  9. 图文详解AO打印(端桥模式)

    一.概述   AO打印是英文Active-Online Print的简称,也称主动在线打印.打印前支持AO通讯协议的AO打印机首先通过普通网络与C-Lodop服务保持在线链接,网页程序利用JavaSc ...

  10. 使用canvas绘制时钟 (http://heeroluo.net/Article/Detail/95)

    准备工作 在HTML中指定一个区域放置时钟: <div id="clock" style="position: relative;"></di ...