jquery中添加屬性和刪除屬性

更新時間：2015年06月03日 11:57:52 投稿：hebedich

本文給大家介紹的是jquery中添加屬性和刪除屬性的方法和具體的示例，有需要的小伙伴可以參考下

jquery中添加屬性和刪除屬性：

復(fù)制代碼代碼如下:

$("#2args").attr("disabled",'disabled');

$("#2args").removeAttr("disabled");

問題背景：

選擇“選項1”是，“兩個參數(shù)”這個單選按鈕有效。

選擇“選項2”時，讓“兩個參數(shù)”的這個單選按鈕無效。

代碼：

<!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>參數(shù):</label>
   <div class="controls">
    <br/>
    <label class="radio" for="1arg">
     <input type="radio" name="nodes" id="1arg" value="1" checked="checked" />
     單個參數(shù)
    </label>
    <br/>
    <label class="radio" for="2args">
     <input type="radio" name="nodes" id="2args" value="2" />
     兩個參數(shù)
    </label>
    <br/>
    <label class="radio" for="3args" >
     <input type="radio" name="nodes" id="3args" value="3" disabled="disabled" />
     三個參數(shù)
    </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>

以上所述就是本文的全部內(nèi)容了，希望大家能夠喜歡。

您可能感興趣的文章: