按钮启用和禁用点击

问题描述:

所以我有这个链接按按钮启用和禁用点击

<a href="link" target="_blank"> 
    <div class="well"> 
     <span> blabla </span> 
    </div> 
</a> 

,这个按钮的代码在一个页面

<button type="submit" class="btn-primary btn-lg" disabled="disabled"> Blabla </button> 

正如你可以看到按钮被禁用现在。我怎么能做到这一点,当我按下该链接的按钮重新启用?对不起,我的英语不好。

试试这个广义函数toggleDisabled

//Generalized function to make element toggleDisabled. 
 
(function($) { 
 
    $.fn.toggleDisabled = function(){ 
 
     return this.each(function(){ 
 
      this.disabled = !this.disabled; 
 
     }); 
 
    }; 
 
})(jQuery); 
 
//Code to use toggleDisabled 
 
$(document).ready(function(){ 
 
    $("a").click(function(){ 
 
     $("button[type='submit']").toggleDisabled(); 
 
    }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<a href="link" target="_blank"> 
 
    <div class="well"> 
 
     <span> blabla </span> 
 
    <div> 
 
</a> 
 
<br/>  
 
<button type="submit" class="btn-primary btn-lg" disabled="disabled"> Blabla </button>

我建议在您的按钮和链接中添加一个id属性,以便使用Javascript更容易访问。比方说,你分配id="myButton"到按钮,id="myLink"到锚标签:

$(document).ready(function(){ 
 
    $("a").click(function(){ 
 
    $("button[type='submit']").removeAttr('disabled'); 
 
    }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<a href="link" target="_blank"><div class="well"> 
 
    <span> blabla </span> 
 
    <div></a> 
 
    
 
<button type="submit" class="btn-primary btn-lg" disabled="disabled"> Blabla </button>

$('#myLink').on('click', function() { 
    $('#myButton').prop('disabled', false); 
}); 

希望

document.getElementById('click').onclick = function(event){ 
// on click prevent the default behavior 
event.preventDefault(); 
document.getElementsByClassName('btn-primary')[0].disabled = false; 
} 

JSFIDDLE

在这里你去这个代码将是有益的