我想在 Jquery 中使用禁用和启用的功能答案

【问题标题】：I want to use disabled and enabled function with Jquery我想在 Jquery 中使用禁用和启用的功能
【发布时间】：2015-03-14 02:47:59
【问题描述】：

当我在文本框中输入 x1 并按下按钮时，会出现警报。由于优惠券已被使用，在我关闭警报后，文本框和按钮被禁用

我将删除优惠券文本附加到它附近，当我单击删除优惠券文本时，文本框和按钮将变为启用状态。但是，当我第二次单击该按钮时，它会第二次附加到 Remove Coupon 文本的附近。当我移除移除优惠券并启用它时，如何一次又一次地应用该过程？

这是我的代码和演示；

<input type="text" id="couponInput" class="couponInput" placeholder="Coupon code" />                                                 
<button type="button" id="couponApply" class="couponApply">APPLY COUPON</button>                           
<span class="removeCoupon"></span>

$(document).ready(function(){
     $('.couponApply').click(function(event){
       var couponInputval = $(".couponInput").val();

       if(couponInputval == "x1"){
          alert('Coupon Applied!');
          $( ".removeCoupon" ).append( "Remove Coupon" );
          $(".couponInput, .couponApply").attr('disabled','disabled');          

          $('.removeCoupon').click(function(){
            $(".couponInput, .couponApply").removeAttr('disabled','disabled');            
          });
       }
       else{
         alert('Error');
       }
       event.preventDefault();
    });
  });

http://jsfiddle.net/509yp6k0/

【问题讨论】：

你应该使用.prop()来设置disabled布尔属性

标签： javascript jquery html web frontend

【解决方案1】：

试试这个

$('.removeCoupon').on('click', function(){ 
    $(".couponInput, .couponApply").removeAttr('disabled', 'disabled');
    $(this).empty();
});

【讨论】：

仅供参考，这不是代表

【解决方案2】：

如果我明白您的要求，您只需在移除优惠券时从span 中移除Remove coupon 文字即可。你可以使用empty()：

$('.removeCoupon').click(function () {
    $(".couponInput, .couponApply").prop('disabled', false);
    $(this).empty();
});

Updated fiddle

【讨论】：