button 按钮 的 disabled 两种状态 (启用和禁用)

最新推荐文章于 2024-05-27 14:46:49 发布
最新推荐文章于 2024-05-27 14:46:49 发布
阅读量6.1w 收藏 11
点赞数 4
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/SonaEx/article/details/80879061
版权

禁用按钮：

  1. $("#id").attr("disabled","true");
  2. $("#id").attr("disabled",true);
  3. $("#id").attr("disabled","disabled"); 
 

 


 

启用按钮：
 

 

  1.  
  
     
   
     
  
     
  
     
   
    
     $("#id").removeAttr("disabled"); 
   
     
  
  2.  
  
     
   
     
  
     
  
     
   
    
     $("#id").attr("disabled",false); 
   
     
  
 

 

 

注意：
 

 

 

  1.  
  
     
   
     
  
     
  
     
   
    
     1、$("#id").attr("disabled","false");不起作用 
   
     
  
  2.  
  
     
   
     
  
     
  
     
   
    
     2、disabled只能禁用button，对超链接不起作用 
   
     
  
  3.  
  
     
  

                

        

        

    




    

      

        

            

              
                
                  SonaEx
                
              
            

            

                关注
              
            

        

        

          
    
            
  • 
              
                
                
                
                
                    4
                
              
              
    点赞
    
            
    • 
            
  • 
              
                
                
                
              
              
    踩
    
            
    • 
            
  • 
              
                
                
                
                
                    11
                
              
              
    
                
    
                  
                    收藏
                  
                
    
              
    
              
    
                
    
                  觉得还不错?
                  
                    一键收藏
                  
                 
                
    
              
    
            
    • 
          
  • 
            
    
              
              
            
    
              
              
              
                    0
              
            
            
    评论
    
          
    • 
          
  • 
          
    • 
          
  • 
            
              
            
              
    
            
              
                
            
    
          
    • 
        

      

      










                



	

		

			

				
					
javascript按钮禁用和启用的效果实例代码

				
			

			

				

					10-19
				

			

		

		

			
				
主要介绍了javascript按钮禁用和启用的效果实例代码,需要的朋友可以参考下

			
		

	



                

              
                



	

		

			

				
					
jquery disable按钮（启用、禁用按钮）

					
热门推荐

				
			

			

				

					wangjun5159的专栏
				

				

					08-14
					
					8万+
					
				

			

		

		

			
				
启用按钮：
$("#id").attr("disabled","disabled");



禁用按钮：
$("#id").$("#id").removeAttr("disabled");

			
		

	



                


  
              

                


	

		

			

				
					
el-button的disabled属性无效

					
最新发布

				
			

			

				

					资深Bug开发大师
				

				

					05-27
					
					524
					
				

			

		

		

			
				
【代码】el-button的disabled属性无效。

			
		

	





	

		

			

				
					
jquery的disabled

				
			

			

				

					sinolzeng的专栏
				

				

					09-22
					
					4296
					
				

			

		

		

			
				
在html标签中设置按钮被禁用，可以使用如下代码

			
		

	



		

			
		



	

		

			

				
					
JQuery 只读(readOnly)和禁用(disabled)

				
			

			

				

					是个非常热爱生活、乐观、奋斗、努力的逗比青年
				

				

					05-16
					
					3085
					
				

			

		

		

			
				
只读和禁用属性，其实只要掌握一种，就会第二种，两种方法一样，就是属性变了一下！

			
		

	





	

		

			

				
					
按钮（button）在disabled状态下，无法阻止事件冒泡

				
			

			

				

					yurisa1994的博客
				

				

					06-30
					
					505
					
				

			

		

		

			
				
不知道大家遇到过这个问题没，本来button是有点击事件的，做了事件冒泡，但是按钮设为禁用（disabled）的状态时，事件冒泡不起作用了，会触发外层的点击事件，搜索无果。自己创造了解决办法，在按钮外层套一个div，并加一个没有任何操作的事件，完美阻止冒泡。

			
		

	





	

		

			

				
					
jQuery的disabled属性设置的三种方法

				
			

			

				

					羽裳醉月的博客
				

				

					06-04
					
					8682
					
				

			

		

		

			
				
$(document).ready(function () {
	// 1．移除disabled属性
	$("input[id='txtInput_1']").Attr("disabled", "disabled");
	$("input[id='txtInput_1']").removeAttr("disabled");

	// 2．改变disabled的boolean值
	$("input[id='txtInput_2']").Attr("disabled", true);
	$("input[id=

			
		

	





	

		

			

				
					
微信小程序点击按钮动态切换input的disabled禁用/启用状态功能

				
			

			

				

					10-15
				

			

		

		

			
				
 isDisabled: true, // 当disabled为false时，切换回禁用状态  text: "编辑" // 文字变回“编辑”  });  } else {  this.setData({  isDisabled: false, // 当disabled为true时，切换到启用状态  text: "保存" // ...

			
		

	





	

		

			

				
					
页面按钮禁用与解除禁用的方法

				
			

			

				

					09-04
				

			

		

		

			
				
主要介绍了页面按钮禁用与解除禁用的方法,需要的朋友可以参考下

			
		

	





	

		

			

				
					
jQuery设置disabled属性与移除disabled属性

				
			

			

				

					极客神殿
				

				

					10-11
					
					1万+
					
				

			

		

		

			
				
Readonly只针对input和textarea有效，而disabled对于所有的表单元素都有效。
表单中readOnly和disabled的区别：
Readonly只针对input(text/ password)和textarea有效，而disabled对于所有的表单元素都有效，包括select,radio, checkbox, button等。
但是表单元素在使用了disabled后，当我们...

			
		

	





	

		

			

				
					
按钮设置为禁用状态

				
			

			

				

					uaena的博客
				

				

					04-14
					
					6914
					
				

			

		

		

			
				
在发起异步请求之前，将按钮设置为禁用状态，等待后端响应之后再将按钮设置为启用状态。

			
		

	





	

		

			

				
					
用jquery设置按钮的disabled属性的实现代码

				
			

			

				

					12-09
				

			

		

		

			
				
在html标签中设置按钮被禁用，可以使用如下代码 <input type=’button’ id=’test’ value=’disabled’> 在jquery中可以使用attr()函数修改按钮的disable属性 $(“#test”).attr(‘disabled’,false); jquery 控制button的disabled属性  代码如下: $(‘#button’).attr(‘disabled’,”true”);添加disabled属性 $(‘#button’).removeAttr(“disabled”); 移除disabled属性

			
		

	





	

		

			

				
					
elementUI里的button使用disabled属性

				
			

			

				

					苦瓜_小学生的博客
				

				

					11-18
					
					4993
					
				

			

		

		

			
				
学习记录：
实现在table列表中控制二次点击按钮时对应行的button为不可点击，效果图如下：

1.el-table在表格按钮标签中定义disabled属性
HTML部分代码：
<div id="app"> 
	<el-table :data="showTableData" 
                <el-table-column fixed="right"
                                 label="操作"
            

			
		

	





	

		

			

				
					
el-button 的 disabled 属性

				
			

			

				

					Svn_Crush的博客
				

				

					11-24
					
					1545
					
				

			

		

		

			
				
disabled = "false" 默认不禁用按钮。:disabled = "true"  禁用按钮。我总是分不清，记录一下。

			
		

	





	

		

			

				
					
重新认识button disabled属性

				
			

			

				

					aimeizi1314的博客
				

				

					08-14
					
					1424
					
				

			

		

		

			
				
通过setAttribute()设置禁用为false，依然是禁用状态。
因此，disabled =“true”，disabled =“disabled”和disabled =“false”都是一样的结果；
而应该用下面两种方式：

1.element.removeAttribute("disabled")；
2.element.disabled = false;


　　...

			
		

	





	

		

			

				
					
按钮的禁用disabled属性

				
			

			

				

					m0_56628949的博客
				

				

					03-01
					
					1万+
					
				

			

		

		

			
				
按钮的禁用disabled属性

			
		

	





	

		

			

				
					
用jquery设置按钮的disabled属性来实现按钮的禁用

				
			

			

				

					zhouchang111的博客
				

				

					02-02
					
					6275
					
				

			

		

		

			
				

1,虽然可以在button标签中直接添加disable属性来实现按钮的禁用，
但是并没有什么意义，按钮是用来按的，素以要实现有条件的禁用。
使用jquery选择器选定标签，再使用attr()函数控制按钮的disable属性，
就能实现按钮的有条件禁用，直接来看函数：
 
$('#button').attr('disabled',"true");添加disabled属性 
$('#b...

			
		

	





	

		

			

				
					
jquery设置button的disable状态

				
			

			

				

					weixin_33755649的博客
				

				

					02-25
					
					680
					
				

			

		

		

			
				
$("#btn").attr('disabled', 'disabled');$("#btn").removeAttr('disabled');另外对于span做的按钮如下：<span class="btncl" onclick="close()">取消</span>如果click事件已经写在html标签内，使用unbind是不起作用的$(".btn...

			
		

	





	

		

			

				
					
jquery 控制button的disabled属性

				
			

			

				

					风一样的人
				

				

					01-06
					
					3235
					
				

			

		

		

			
				
jquery 控制button的disabled属性 
$('#button').attr('disabled',"true");添加disabled属性 
$('#button').removeAttr("disabled"); 移除disabled属性

			
		

	





	

		

			

				
					
在elementUI中如何动态启用或禁用按钮？

				
			

			

				

					06-03
				

			

		

		

			
				
在ElementUI中，你可以使用 `:disabled` 属性来动态启用或禁用按钮。这个属性可以绑定一个布尔值，当它为 `true` 时，按钮会被禁用，否则按钮可以使用。

例如，你可以在模板中这样使用：

```html
<el-button :disabled="isDisabled">点击我</el-button>
```

其中，`isDisabled` 是一个在你的组件中定义的数据属性，它的值可以根据你的需求动态改变。例如，你可以在处理某个事件时将它设置为 `true`，禁用按钮，处理完毕后再将它设置为 `false`，启用按钮。

```javascript
data() {
  return {
    isDisabled: false
  }
},
methods: {
  handleClick() {
    // 禁用按钮
    this.isDisabled = true

    // 处理事件
    // ...

    // 启用按钮
    this.isDisabled = false
  }
}
```

			
		

	



              



  
“相关推荐”对你有帮助么？

  

      
    
          
  • 
              
    
                  
                  
              
    
              
    非常没帮助
    
          
    • 
          
  • 
              
    
                  
                  
              
    
              
    没帮助
    
          
    • 
          
  • 
              
    
                  
                  
              
    
              
    一般
    
          
    • 
          
  • 
              
    
                  
                  
              
    
              
    有帮助
    
          
    • 
          
  • 
              
    
                  
                  
              
    
              
    非常有帮助
    
          
    • 
      

      

      

          
          提交
      

      

  




          




        



    





    



      

      

        
      

      





	

		评论	
	

	
	




  

    

      添加红包
      
    

    

      

        
        

          
          
        

        
请填写红包祝福语或标题

      

      

        
        

          
          个
        

        
红包个数最小为10个

      

      

        
        

          
          元
        

        
红包金额最低5元

      

      

        
        

          当前余额3.43元
          前往充值 >
        

      

      

        

          需支付：10.00元
        

        
        
      

    

  





  

    
    
  

  

    
    
  








  

    

      

        

          

            
            
成就一亿技术人!

          

          

        

        

          

          

            领取后你会自动成为博主和红包主的粉丝
            规则
          

        

      

      

        

          

            
              
            
            

              
hope_wisdom
 发出的红包
            

          

        

        

          

          

          

        

      

    

    

  



      
      

      
实付元

      
使用余额支付

      

        

          

            
            点击重新获取
          

        

        
扫码支付

      

      

        
          
            
          
          
        
      

      

        
        钱包余额
          0
          

            
            

              

                
抵扣说明：

                
 1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
 2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

              

            

          

      

      余额充值