zoukankan      html  css  js  c++  java
  • JQuery实现radio、select、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

  • 相关阅读:
    近来感受
    GIT相关命令
    CMMI评审总结
    Windows下Git Bash的设置
    PHP学习三--常用运算符和结构语句
    PHP学习二--常量
    MYSQL基础十一--存储引擎
    MYSQL基础十--存储过程
    MYSQL基础九--自定义函数
    MYSQL基础八--子查询和连接
  • 原文地址:https://www.cnblogs.com/ourLifes/p/7193626.html
Copyright © 2011-2022 走看看