jquery 实现radio、select、checkbox禁用

最新推荐文章于 2024-02-24 13:39:38 发布

black1982

最新推荐文章于 2024-02-24 13:39:38 发布

阅读量266

点赞数

分类专栏： jquery 文章标签： javascript ViewUI

本文链接：https://blog.youkuaiyun.com/black1982/article/details/84359463

版权

jquery 专栏收录该内容

4 篇文章

订阅专栏

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");

页面代码:

<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>