在jquery中可以通过jqueryObj.attr("disabled","disabled")将页面中某个元素置为不可编辑或触发状态,但是在jquery的API reference中并没说明怎么将页面置为disable的元素重新置为可触发或可编辑的。
 

这里发现可以采用三种的变通方法将置为disabled的元素状态改为enabled。
第一种:改变disabled的boolean状态,具体代码及解释如下:

复制代码 代码如下:
$("button:eq(2)").click(function(){
var text2=$("input:text:eq(2)");
if(text2.attr("disabled")==false){
//通过设置disabled的boolean属性将第三个text输入框disabled属性置为true
text2.attr("disabled",true);
}else{
//通过将第三个text输入框disabled属性置为false来移除disabled属性
text2.attr("disabled",false);
}
});

第二种:移除disabled属性,具体代码及解释如下:

复制代码 代码如下:
$("button:eq(1)").click(function(){
var text2=$("input:text:eq(1)");
if(text2.attr("disabled")==false){
//通过设置disabled的值将第二个text输入框置为disabled
text2.attr("disabled","disabled");
}else{
//通过移除的方式将第二个text输入框的disable属性删除
text2.removeAttr("disabled");
}
});

第三种:改变disabled的值,具体代码及解释如下:

复制代码 代码如下:

$("button:eq(0)").click(function(){
var text1=$("input:text:eq(0)");
if(text1.attr("disabled")==""){
// 或者text1.attr("disabled")==false
//通过设置disabled的值将第一个text输入框置为disabled
text1.attr("disabled","disabled");
}else{
//通过覆盖的方式将第一个text输入框中的disabled属性清除掉
text1.attr("disabled","");
}
});

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head> <script src="jquery的路径引入就行了"></script>
<script type="text/javascript"><!--
$(document).ready(function () {
$("button:eq(0)").click(function () {
var text1 = $("input:text:eq(0)");
if (text1.attr("disabled") == "") {
// 或者text1.attr("disabled")==false
//通过设置disabled的值将第一个text输入框置为disabled
text1.attr("disabled", "disabled");
} else {
//通过覆盖的方式将第一个text输入框中的disabled属性清除掉
text1.attr("disabled", "");
}
});
$("button:eq(1)").click(function () {
var text2 = $("input:text:eq(1)");
if (text2.attr("disabled") == false) {
//通过设置disabled的值将第二个text输入框置为disabled
text2.attr("disabled", "disabled");
} else {
//通过移除的方式将第二个text输入框的disable属性删除
text2.removeAttr("disabled");
}
});
$("button:eq(2)").click(function () {
var text2 = $("input:text:eq(2)");
if (text2.attr("disabled") == false) {
//通过设置disabled的boolean属性将第三个text输入框disabled属性置为true
text2.attr("disabled", true);
} else {
//通过将第三个text输入框disabled属性置为false来移除disabled属性
text2.attr("disabled", false);
}
});
});
// --></script>
</head>
<body>
<button>disabledNull</button>
<input type="text" value="input something into me!" size="40"/>
<br/>
<button>disabledRemove</button>
<input type="text" value="input something into me!" size="40"/>
<br/>
<button>disabledState</button>
<input type="text" value="input something into me!" size="40"/>
</body>
</html>

JS将下拉框的disable变为able的方法的更多相关文章

  1. Js获取下拉框选定项的值和文本

    Js获取下拉框的值和文本网上提供了2种方法:但有些人很不负责任,他们根本没考虑到浏览器之间的差异导致的错误,导致很多新手琢磨了半天找不出错误! 下面我总结下Firefox和IE下获取下拉框选定项的值和 ...

  2. JS模拟下拉框select

    最近做的一个项目有下拉框 同事都是用的是美化控件,但是用美化控件当然是好 但是网上找的一个控件不知道扩展性怎么样?对以后的维护会不会造成有影响?比如我想增加一个功能或者减少一个功能会不会影响?还有就是 ...

  3. js改变下拉框内容

      js改变下拉框内容 CreateTime--2018年4月8日18:47:38 Author:Marydon 适用场景:通常情况下,级联菜单.通过ajax异步获取后台数据改写下拉框内容会有这种需求 ...

  4. JS 实现下拉框去重

    JS 实现下拉框去重 学习内容: 需求 总结: 学习内容: 需求 用 JS 下拉框去重 实现代码 <html> <head> <meta http-equiv=" ...

  5. JS 实现下拉框回显

    JS 实现下拉框回显 学习内容: 需求 总结: 学习内容: 需求 用 JS 实现下拉框回显 实现代码 <!DOCTYPE html> <html lang="en" ...

  6. JS实现下拉框选中不同的项,对应显示不同的信息

    实现的效果如下图: 页面代码 下拉框: <select id="select3" name="select3" onchange="showli ...

  7. 快速解决js开发下拉框中blur与click冲突

    在开发中我们会经常遇到blur和click冲突的情况.下面叙述了开发中常遇到的"下拉框"的问题,并提供了两种解决方案. 一.blur和click事件简述 blur事件:当元素失去焦 ...

  8. avalon.js 多级下拉框实现

    学习avalon.js的时候,有一个多级下拉框的例子,地址 戳这里 代码实现了联动, 但是逻辑上面理解有点难度,获取选择的值 和 页面初始化 功能存在问题. 在写地图编辑的时候,也用到了多级下拉框,特 ...

  9. js 设置下拉框的默认值

    设置下拉框的默认值,直接在option中增加selected就可以了.但是现在要使用JS来设置它的默认值,代码如下: <select name="aaa" id=" ...

随机推荐

  1. html5 全屏滚动活动页学习

    先看几个具体的实例: 1.腾讯娱乐:http://ent.qq.com/zt2014/qqent/h5.htm?from=groupmessage&isappinstalled=0 2.苏宁互 ...

  2. VB.Net 字符串加密类

    Public Class Cls_JM '使用 'Dim Jm As New Cls_JM(2) 'Dim strTmp As String 'Jm.jiemi(strTmp) 'Jm.Jiami(s ...

  3. 【Java】Linux下安装配置Oracle JDK 1.7版本

    1 环境 Vmware虚拟机中的Ubuntu 12.04 32位系统 2具体安装步骤 ①下载最新的jdk包 注意jdk区分32位版本和64位版本,要与Ubuntu兼容才行 下载地址 http://ww ...

  4. (转)《深入理解java虚拟机》学习笔记8——Tomcat类加载器体系结构

    Tomcat 等主流Web服务器为了实现下面的基本功能,都实现了不止一个自定义的类加载器: (1).部署在同一个服务器上的两个web应用程序所使用的java类库可以相互隔离. (2).部署在同一个服务 ...

  5. SYBASE时间计算

    以摘录了计算月初,月末,上月同日,下月同日,上年同日,下年同日(年有闰月问题),各种函数输出格式. 可以写到存储过程中也可单独使用. Sybase日期函数 文章分类:数据库 关键字: sybase日期 ...

  6. 【BZOJ 1189】[HNOI2007]紧急疏散evacuate

    Description 发生了火警,所有人员需要紧急疏散!假设每个房间是一个N M的矩形区域.每个格子如果是'.',那么表示这是一块空地:如果是'X',那么表示这是一面墙,如果是'D',那么表示这是一 ...

  7. Orcale Function Sequence

    Orcale Function Sequence. 1 Create Or Replace Function F_Get_Sequence(As_Companyno In Varchar2, As_T ...

  8. 实时数据处理环境搭建flume+kafka+storm:1.zookeeper 安装配置

    1. 解压 tar -zxvf 2.创建目录  zk根目录创建         mkdir zkdatalog  --日志          mkdir zkdata  ---快照文件 3.修改配置文 ...

  9. java程序练习:x进制转Y进制

    /*X进制到Y进制转换*/ /*Step1.提示用户输入数据的进制X *Step2.接收用户输入的数据,保存到X * Scanner方法 *Step3.接收用户输入X进制的数据,保存到num *Ste ...

  10. js检测对象的类型

    在JavaScript中,想要判断某个对象值属于哪种内置类型,最靠谱的做法就是通过Object.prototype.toString方法. 示例: var array=[1,2,3]; Object. ...