您的位置：首页 > Web前端 > JQuery

JQuery设置和去除disabled属性

2016-03-11 10:25 756 查看
在HTML的<input>标签中，我们常用disabled属性来暂时禁用一些输入框

可以通过JQuery来设置和去除disabled属性，起到启用禁用和解除禁用的作用

JQuery代码:

//两种方法设置disabled属性　　
$('#area').attr("disabled",true);
$('#area').attr("disabled","disabled");
//三种方法移除disabled属性
$('#area').attr("disabled",false);
$('#area').removeAttr("disabled");
$('#area').attr("disabled","");

完整例子:
<pre name="code" class="html"><!DOCTYPE html>
<html>
<head>
<title>Jquery设置disabled属性</title>
<meta http-equiv="content-type" content="text/html;charset=gb2312">
<style>
*{margin:0;padding:0}
.test{width:20%;height:100px;border:2px solid green;padding:10%;margin:100px auto}
</style>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.12.0.min.js"></script>
</head>
<body>
<div class="test">
<label>测试输入框</label>
<input type="text" id="text" name="text" size="40">
<br>
<input type="button" id="on" value="启用">
<input type="button" id="off" value="禁用">
<script>
$('#on').click(function(){
$('#text').attr("disabled",false);
});
$('#off').click(function(){
$('#text').attr("disabled","disabled");
});
</script>
</div>
</body>
</html>


文章来自我在开源中国的博客

开源中国博客地址：http://my.oschina.net/u/2540091/blog/634927


                                            

                                        

                        
                        内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息 
                    

                    

                    

                        

                         标签： 
                                                jquery
                                                html
                                                disabled
                                                前端
                                                设置
                                                

                        

                    


                

            


            

                
相关文章推荐

                

                
            

        

        

            

            
            

                

                    
新的分享

                    

                        
                    

                

            


            

                

                    
章节导航