jquery中添加属性和删除属性


Posted in Javascript onJune 03, 2015

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>

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
js对列表中第一个值处理与jsp页面对列表中第一个值处理的区别详解
Nov 05 Javascript
js获取url中&quot;?&quot;后面的字串方法
May 15 Javascript
JavaScript实现数组随机排序的方法
Jun 26 Javascript
js实现的光标位置工具函数示例
Oct 03 Javascript
Bootstrap CSS组件之输入框组
Dec 17 Javascript
详解用原生JavaScript实现jQuery的某些简单功能
Dec 19 Javascript
jQuery点击头像上传并预览图片
Feb 23 Javascript
Bootstrap多级菜单的实现代码
May 23 Javascript
AngularJS 事件发布机制
Aug 28 Javascript
vue改变循环遍历后的数据实例
Nov 07 Javascript
jQuery使用jsonp实现百度搜索的示例代码
Jul 08 jQuery
JS封装cavans多种滤镜组件
Feb 15 Javascript
JavaScript中的条件判断语句使用详解
Jun 03 #Javascript
简单介绍JavaScript的变量和数据类型
Jun 03 #Javascript
在HTML中插入JavaScript代码的示例
Jun 03 #Javascript
jQuery事件绑定on()、bind()与delegate() 方法详解
Jun 03 #Javascript
在浏览器中打开或关闭JavaScript的方法
Jun 03 #Javascript
浅谈javascript中基本包装类型
Jun 03 #Javascript
js中函数声明与函数表达式
Jun 03 #Javascript
You might like
利用js调用后台php进行数据处理原码
2006/10/09 PHP
ob_start(),ob_start('ob_gzhandler')使用
2006/12/25 PHP
ThinkPHP单字母函数(快捷方法)使用总结
2014/07/23 PHP
PHP和Mysql中转UTF8编码问题汇总
2015/10/10 PHP
微信支付开发发货通知实例
2016/07/12 PHP
javascript 异常处理使用总结
2009/06/21 Javascript
原生js实现跨浏览器获取鼠标按键的值
2013/04/08 Javascript
javascript写的一个模拟阅读小说的程序
2014/04/04 Javascript
javascript Deferred和递归次数限制实例
2014/10/21 Javascript
Backbone.js的Hello World程序实例
2015/06/19 Javascript
JavaScript中字符串与Unicode编码互相转换的实现方法
2015/12/18 Javascript
详解使用angular-cli发布i18n多国语言Angular应用
2017/05/20 Javascript
浅谈js获取ModelAndView值的问题
2018/03/28 Javascript
JS解析后台返回的JSON格式数据实例
2018/08/06 Javascript
深入理解JavaScript的值传递和引用传递
2018/10/24 Javascript
Android 自定义view仿微信相机单击拍照长按录视频按钮
2019/07/19 Javascript
thinkjs微信中控之微信鉴权登陆的实现代码
2019/08/08 Javascript
在layui中对table中的数据进行判断(0、1)转换为提示信息的方法
2019/09/28 Javascript
比较详细Python正则表达式操作指南(re使用)
2008/09/06 Python
使用Python脚本实现批量网站存活检测遇到问题及解决方法
2016/10/11 Python
tensorflow实现简单的卷积神经网络
2018/05/24 Python
Python实现爬取马云的微博功能示例
2019/02/16 Python
Django模型验证器介绍与源码分析
2020/09/08 Python
HTML里显示pdf、word、xls、ppt的方法示例
2020/04/14 HTML / CSS
一站式跨境收款解决方案:Payoneer(派安盈)
2018/09/06 全球购物
绿色美容,有机护肤品和化妆品:Safe & Chic
2018/10/29 全球购物
Shopee新加坡:东南亚与台湾电商平台
2019/01/25 全球购物
Aurora London官网:奢华、负担得起的皮革手袋
2020/08/01 全球购物
中学门卫岗位职责
2013/12/26 职场文书
学习雷锋寄语大全
2014/04/11 职场文书
企业安全生产承诺书
2014/05/22 职场文书
幼儿园园务工作总结2015
2015/05/18 职场文书
起诉意见书范文
2015/05/19 职场文书
高中历史教学反思
2016/02/19 职场文书
MySQL入门命令之函数-单行函数-流程控制函数
2021/04/05 MySQL
PHP实现rar解压读取扩展包小结
2021/06/03 PHP