`

html的disabled使用

 
阅读更多
disabled 属性规定应该禁用 input 元素。

被禁用的 input 元素既不可用,也不可点击。可以设置 disabled 属性,直到满足某些其他的条件为止(比如选择了一个复选框等等)。然后,就需要通过 JavaScript 来删除 disabled 值,将 input 元素的值切换为可用。

注释:disabled 属性无法与 <input type="hidden"> 一起使用。

<html>
<body>
<script type="text/javascript">
   function butt(able){
      if('undisabled'==able){
         document.getElementById("bbb").disabled="";
      }else{
         document.getElementById("bbb").disabled="true";
       }    
   }
   
</script>
<form action="/example/html/form_action.asp" method="get">
    <p>First name: <input id="aaa" type="text" name="fname" /></p>
    <p>Last name: <input id="bbb" type="text" name="lname" value="哈哈" disabled="disabled" /></p>
  <input onclick= "butt('disabled')" type="button" value="disabled" />
  <input onclick= "butt('undisabled')" type="button" value="undisabled" />
  <input type="submit" value="Submit" />
</form>

<p>请在提交按钮上单击,输入会发送到服务器上名为 "form_action.asp" 的页面。</p>

</body>
</html>



给元素增加和删除disabled属性
<div id="esealSubRight_cbx">
    <p>
        <label >签章管理:</label>
            <input id="subRightWhiteList1" name="subRightWhiteList" type="checkbox" value="14-01-01-00-00-00-00-00-00-00-00" checked="checked">公章管理</input>&nbsp
            <input id="subRightWhiteList2" name="subRightWhiteList" type="checkbox" value="14-01-02-00-00-00-00-00-00-00-00" checked="checked">私章管理</input><br>
            <input id="subRightWhiteList3" name="subRightWhiteList" type="checkbox" value="14-01-03-00-00-00-00-00-00-00-00" checked="checked">签章申请</input>&nbsp
            <input id="subRightWhiteList4" name="subRightWhiteList" type="checkbox" value="14-01-04-00-00-00-00-00-00-00-00" checked="checked">签章制作</input>
     </p>
</div>
<script type="text/javascript">
	function testmethod(){
		alert('testmethod');
		$("#subRightWhiteList1").attr("disabled","disabled");
		$("#subRightWhiteList2").attr("disabled","disabled");
		$("#subRightWhiteList3").attr("disabled","disabled");
		$("#subRightWhiteList4").attr("disabled","disabled");
	}
		function testmethod2(){
			alert('testmethod2');
			$("#subRightWhiteList1").removeAttr("disabled");
			$("#subRightWhiteList2").removeAttr("disabled");
	}
</script>

如果将外层的div加上disabled属性,里面的input框是不能修改了,但后台还能接收到值,只能将disabled属性直接加到input框上
分享到:
评论

相关推荐

    用jquery设置按钮的disabled属性的实现代码

    在html标签中设置按钮被禁用,可以使用如下代码 &lt;input type=’button’ id=’test’ value=’disabled’&gt; 在jquery中可以使用attr()函数修改按钮的disable属性 $(“#test”).attr(‘disabled’,false); ...

    disabled属性

    1. **动态设置:** 使用JavaScript动态设置`disabled`属性时,需要注意同步更新DOM中的状态。 2. **无障碍访问:** 对于无障碍访问的支持,应该为禁用的控件添加适当的提示信息,确保屏幕阅读器能够正确读取。 3. **...

    select-disabled-传值

    接下来,为了确保页面加载时`select`元素处于不可编辑状态,可以使用JavaScript或jQuery来动态地设置`disabled`属性: ```javascript $(document).ready(function() { $("#postSelect").prop("disabled", true); }...

    HTML中Select不用Disabled实现ReadOnly的效果

    方法如下: 代码如下:&lt;select onbeforeactivate=”return false” onfocus=”this.blur()” onmouseover=”this.setCapture()” onmouseout=”this.releaseCapture()”&gt; &lt;option&gt;1 &lt;...

    基于js disabled=&quot;false&quot;不起作用的解决办法

    当需要禁用某个HTML表单元素时,通常的代码是使用element.disabled = true。相对应的,如果想取消禁用状态使元素变得可用,标准的写法应该是element.disabled = false。然而,在实际的开发过程中,有些开发者可能会...

    html表单属性readonly和disabled的使用方法

    - 使用方法:同样是在HTML元素上添加`disabled`属性,例如`&lt;input type="text" disabled&gt;`。 两者之间的关键区别在于,`readonly`字段在提交表单时仍会传递其值,而`disabled`字段则不会。此外,`readonly`字段...

    web组件disabled之后灰色变亮样式调整

    以上代码示例中,`.disabled-style`类定义了一系列针对`disabled`状态元素的样式规则,然后通过`@extend`语法(这里假设使用了预处理器如Sass/SCSS)将这些规则应用到了`input[disabled]`选择器上。实际使用时,可以...

    超链接的禁用属性Disabled使用示例

    本文将深入探讨如何使用`disabled`属性来控制超链接的可用性,并解决一些相关的技术问题。 首先,让我们来看看`disabled`属性的基本用法。在HTML中,我们可以直接在`&lt;a&gt;`标签中设置`disabled`属性,如下所示: ```...

    html form表单input使用disabled后提交不能获取表单值的解决方法

    使用readonly带替代disabled,即把 disabled="disabled" 修改为 readonly="readonly" 二者区别: disabled不能接收焦点,使用tab键时将被跳过,可能不是successful的; readonly可以接收焦点但不能被修改,可以使用...

    Vue动态控制input的disabled属性的方法

    首先,让我们看一下 input 框的 HTML 源代码:配置项" v-bind:disabled="dataForm.id"&gt;。在这个示例中,我们使用了 Vue 的 v-bind 指令来绑定 input 框的 disabled 属性到 dataForm.id 变量上。 那么,dataForm.id ...

    使用jQuery设置disabled属性与移除disabled属性

    本文将详细介绍如何使用jQuery来设置和移除HTML表单元素的`disabled`属性,同时阐述`readonly`与`disabled`之间的区别,并提供相应的jQuery代码示例。 ### readonly属性和disabled属性的区别 1. `readonly`属性只...

    怎样通过disabled和readonly将input设置为只读效果.docx

    在 HTML 中,可以使用以下语法来将 Input 元素设置为 Disabled 状态: ```html &lt;input type="text" id="myInput" disabled&gt; ``` 或者,在 JavaScript 中,可以使用以下代码来将 Input 元素设置为 Disabled 状态: ``...

    form表单中的Input使用disabled不能提交的解决方法

    根据提供的资料,解决问题的关键在于,当遇到使用disabled属性导致表单不能提交的情况时,可以采取以下步骤:首先,在表单提交的事件处理函数中,临时将disabled属性移除,使得表单提交时包含该字段的值。...

    Readonly和Disabled的区别

    Readonly和Disabled是HTML表单中的两个重要的属性,它们都可以限制用户对表单元素的交互操作。尽管它们有共同的功能,即防止表单数据被修改,但它们之间存在着本质的区别。 首先,Readonly属性主要应用于input元素...

    JQuery设置和去除disabled属性的5种方法总结

    然而,在某些场景下,可能需要更复杂的逻辑来判断何时启用或禁用元素,这时可以使用`attr("disabled", false)`或`attr("disabled", "disabled")`,并结合条件语句进行操作。 了解和熟练运用这些方法,可以帮助...

    linux wine 使用指南.html

    Linux Wine使用指南是一个非常实用的主题,对于那些希望在Linux环境下运行Windows应用程序的用户来说,这是一个不可或缺的工具。Wine,全称"Windows Emulator",并非一个模拟器,而是一个兼容层,它允许Linux系统...

Global site tag (gtag.js) - Google Analytics