jquery中添加属性和删除属性
作者:bea
jquery中添加属性和删除属性: 代码如下: $("#2args").attr("disabled",'disabled'); $("#2args").removeAttr("disabled"); 问题背景: 选择“选项1”是,“两个参数”这个单选按钮有效。 选择“选项2”时,让“两个参数”的这个单选按钮无效。 代码: <!DOCTYPE><html ><head> <meta charset="utf-8" /&
jquery中添加属性和删除属性:
代码如下:
$("#2args").attr("disabled",'disabled');
$("#2args").removeAttr("disabled");
问题背景:
选择“选项1”是,“两个参数”这个单选按钮有效。
选择“选项2”时,让“两个参数”的这个单选按钮无效。
代码:
<!DOCTYPE>
<html >
<head>
<meta charset="utf-8" />
<title>demo</title>
<style type="text/css">
.control-group{
margin-bottom: 20px;
}
.controls{
display: inline-block;
vertical-align: top;
}
form{
border:1px dotted #666;
padding: 30px;
display: inline-block;
}
input[disabled],
select[disabled],
textarea[disabled],
input[readonly],
select[readonly],
textarea[readonly] {
cursor: not-allowed;
}
</style>
<body>
<form method="post" action="" onsubmit="return false;">
<div class="control-group">
<label for="project_name">名称:</label>
<input name="project_name" maxlength="20" id="project_name" placeholder="项目名称"></div>
<div class="control-group">
<label>类型:</label>
<select id="project_type" onchange="typeChange()">
<option value="" disabled="disabled"></option>
<option value="" disabled="disabled">------ [ 类型一 ] ------</option>
<option value="1">选项1</option>
<option value="2">选项2</option>
<option value="3">选项3</option>
<option value="" disabled="disabled"></option>
<option value="" disabled="disabled">------ [ 类型二 ] ------</option>
<option value="4">选项4</option>
<option value="5">选项5</option>
<option value="6">选项6</option>
</select>
</div>
<div class="control-group">
<label>参数:</label>
<div class="controls">
<br/>
<label class="radio" for="1arg">
<input type="radio" name="nodes" id="1arg" value="1" checked="checked" />
单个参数
</label>
<br/>
<label class="radio" for="2args">
<input type="radio" name="nodes" id="2args" value="2" />
两个参数
</label>
<br/>
<label class="radio" for="3args" >
<input type="radio" name="nodes" id="3args" value="3" disabled="disabled" />
三个参数
</label>
</div>
</div>
<div class="control-group">
<button id="create_project" type="submit" onclick="beforecreate()">新建</button>
<button >取消</button>
</div>
</form>
<script type="text/javascript" src="js/jquery-2.1.4.min.js"></script>
<script type="text/javascript">
function typeChange(){
var typeLists=['1','2','3','4','5','6'];
var pj_type=$("#project_type option:selected").val();
if(pj_type==2){
$("#2args").attr("disabled",'disabled');
}else if(pj_type==1){
$("#2args").removeAttr("disabled");
}else if($.inArray(pj_type, app_type_list)>=0){
//后期扩展功能
}
}
</script>
</body>
</html>
以上所述就是本文的全部内容了,希望大家能够喜欢。
有用 | 无用
代码如下:
$("#2args").attr("disabled",'disabled');
$("#2args").removeAttr("disabled");
问题背景:
选择“选项1”是,“两个参数”这个单选按钮有效。
选择“选项2”时,让“两个参数”的这个单选按钮无效。
代码:
<!DOCTYPE>
<html >
<head>
<meta charset="utf-8" />
<title>demo</title>
<style type="text/css">
.control-group{
margin-bottom: 20px;
}
.controls{
display: inline-block;
vertical-align: top;
}
form{
border:1px dotted #666;
padding: 30px;
display: inline-block;
}
input[disabled],
select[disabled],
textarea[disabled],
input[readonly],
select[readonly],
textarea[readonly] {
cursor: not-allowed;
}
</style>
<body>
<form method="post" action="" onsubmit="return false;">
<div class="control-group">
<label for="project_name">名称:</label>
<input name="project_name" maxlength="20" id="project_name" placeholder="项目名称"></div>
<div class="control-group">
<label>类型:</label>
<select id="project_type" onchange="typeChange()">
<option value="" disabled="disabled"></option>
<option value="" disabled="disabled">------ [ 类型一 ] ------</option>
<option value="1">选项1</option>
<option value="2">选项2</option>
<option value="3">选项3</option>
<option value="" disabled="disabled"></option>
<option value="" disabled="disabled">------ [ 类型二 ] ------</option>
<option value="4">选项4</option>
<option value="5">选项5</option>
<option value="6">选项6</option>
</select>
</div>
<div class="control-group">
<label>参数:</label>
<div class="controls">
<br/>
<label class="radio" for="1arg">
<input type="radio" name="nodes" id="1arg" value="1" checked="checked" />
单个参数
</label>
<br/>
<label class="radio" for="2args">
<input type="radio" name="nodes" id="2args" value="2" />
两个参数
</label>
<br/>
<label class="radio" for="3args" >
<input type="radio" name="nodes" id="3args" value="3" disabled="disabled" />
三个参数
</label>
</div>
</div>
<div class="control-group">
<button id="create_project" type="submit" onclick="beforecreate()">新建</button>
<button >取消</button>
</div>
</form>
<script type="text/javascript" src="js/jquery-2.1.4.min.js"></script>
<script type="text/javascript">
function typeChange(){
var typeLists=['1','2','3','4','5','6'];
var pj_type=$("#project_type option:selected").val();
if(pj_type==2){
$("#2args").attr("disabled",'disabled');
}else if(pj_type==1){
$("#2args").removeAttr("disabled");
}else if($.inArray(pj_type, app_type_list)>=0){
//后期扩展功能
}
}
</script>
</body>
</html>
以上所述就是本文的全部内容了,希望大家能够喜欢。
有用 | 无用
猜你喜欢
您可能感兴趣的文章:
- javascript原型模式用法实例详解
- 使用JavaScript刷新网页的方法
- JavaScript中Cookies的相关使用教程
- javascript组合使用构造函数模式和原型模式实例
- 浅析JavaScript中的事件机制
- JavaScript中指定函数名称的相关方法
- JavaScript中Function()函数的使用教程
- JavaScript中的函数嵌套使用
- JavaScript函数使用的基本教程
- 浅谈利用JavaScript进行的DDoS攻击原理与防御
- js动态创建及移除div的方法
- JS实现窗口加载时模拟鼠标移动的方法
- 利用js实现禁止复制文本信息
- 详解JavaScript中循环控制语句的用法
- 讲解JavaScript中for...in语句的使用方法
- JavaScript中for循环的使用详解
- 详解JavaScript的while循环的使用
- jQuery中extend()和fn.extend()方法详解
- JavaScript中switch语句的用法详解