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

时间: 2024-12-06 18:18:01

JQuery实现radio、select、checkbox禁用的相关文章

jQuery操作radio、checkbox、select示例

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title> jQuery操作radio.checkbox.select示例 </title> <meta name="Generator" con

jQuery操作radio、checkbox、select总结

本文转自:http://tiame.iteye.com/blog/1493261 1.radio:单选框 HTML代码: Html代码   <input type="radio" name="radio" id="radio1" value="1" />1 <input type="radio" name="radio" id="radio2" va

jQuery操作radio、checkbox、select 集合

1.radio:单选框 HTML代码: <input type="radio" name="radio" id="radio1" value="1" />1 <input type="radio" name="radio" id="radio2" value="2" />2 <input type="radi

jquery实用应用之jquery操作radio、checkbox、select

本文收集一些jquery的实用技巧,非常实用的哦,其中对radio.checkbox.select选中与取值的方法. 获取一组radio被选中项的值var item = $('input[@name=items][@checked]').val();获取select被选中项的文本var item = $("select[@name=items] option[@selected]").text();select下拉框的第二个元素为当前选中值$('#select_id')[0].sele

JQuery触发radio或checkbox的change事件

在JQuery中,当给radio或checkbox添加一个change事件时,如果它的值发生变化就会触发change事件;本文将详细介绍如何利用JQuery触发Checkbox的change事件需要了解的朋友可以参考下 早上要做一功能,checkbox被选中时,显示隐藏的层,取消选中时,再隐藏选中的层. 初始代码如下: 复制代码代码如下: $(function(){ $("#ischange").change(function() { alert("checked"

JavaScript、jQuery获取radio、checkbox选中的值

1 <div > 2 性别:<input type="radio" id="Radio1" name="rdoSex" value="男"/>男 3 <input type="radio" id="Radio2" name="rdoSex" value="女"/>女 4 <input type="

Jquery常用操作:checkbox、select取值,radio、checkbox、select选中及其相关

常用Jquery操作:checkbox取值.select取值.radio选中.checkbox选中.select选中及其相关: 1.影藏页面元素 使用jquery真的很方便,比如要控制div的显示与隐藏,一句话就搞定了,请看下面使用说明. $("#id").show()表示display:block, $("#id").hide()表示display:none; $("#id").toggle()切换元素的可见状态.如果元素是可见的,切换为隐藏的

jquery的checkbox,radio,select等方法总结

1.checkbox日常jquery操作. 现在我们以下面的html为例进行checkbox的操作. <input id="checkAll" type="checkbox" />全选 <input name="subBox" type="checkbox" />项1 <input name="subBox" type="checkbox" />项2

转-JQuery选择器及radio,checkbox,select取值和反选

jQuery 的选择器可谓之强大无比,这里简单地总结一下常用的元素查找方法 $("#myELement")    选择id值等于myElement的元素,id值不能重复在文档中只能有一个id值是myElement所以得到的是唯一的元素 $("div")           选择所有的div标签元素,返回div元素数组 $(".myClass")      选择使用myClass类的css的所有元素 $("*")