码迷,mamicode.com
首页 > Web开发 > 详细

JQuery实现radio、select、checkbox禁用

时间:2017-07-17 12:33:52      阅读:213      评论:0      收藏:0      [点我收藏+]

标签:lan   art   tar   change   query   func   dai   sdn   checkbox   

<script>
$(document).ready(function(){

   <!-- radio的禁用 -->

    var input = $("#appDIV").find("input:radio");
   input.attr("disabled","disabled");
   input.each(function(){
     if($(this).val()==2){
        $(this).attr("checked",true);
     }    
   });

   <!-- checkbox的禁用 --> 
   var checkbox = $("#ce").find("input:checkbox");
   checkbox.attr("disabled","disabled");
    checkbox.each(function(){
     if($(this).val()=="Monthly"){
        $(this).attr("checked",true);
     }    
   });

   <!-- select的禁用方法一 -->
   $("#selectItem option:disabled").css(‘color‘, ‘#CCC‘); 
   $(‘#selectItem‘).change(function(){ 
    if(this[this.selectedIndex].disabled){ 
     this.selectedIndex = this.s||0; 
    }else{ 

this.s = this.selectedIndex||0; 
    } 
   });

   <!-- select的禁用方法二 -->

   $("#selectItem").attr("disabled","disabled");

});

//以上方法都可以实现

 

 $(this).find("select,:radio,:checkbox").attr("disabled", "disabled");         这样也可以直接实现!

 

</script>

<body>
<div id="appDIV">
    <input type="radio" value="1"/>1
    <input type="radio" value="2"/>2
    <input type="radio" value="3"/>3
</div>

<div id="sel">
   <select id="selectItem">
    <option value="1" disabled="disabled">Flowers</option>
    <option value="2" disabled="disabled">Gardens</option>
    <option value="3" selected>Trees</option>
   </select> 
</div>
<div id="ce">
    <input type="checkbox" name="newsletter" value="Daily" />Dairy
    <input type="checkbox" name="newsletter" value="Weekly" />Weekly
    <input type="checkbox" name="newsletter" value="Monthly" />Monthly
</div>
</body>

 

转自:http://blog.csdn.net/hongleidy5000/article/details/6265488

 

JQuery实现radio、select、checkbox禁用

标签:lan   art   tar   change   query   func   dai   sdn   checkbox   

原文地址:http://www.cnblogs.com/ourLifes/p/7193626.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!