添加和删除类

我有一个jQuery信用卡插件，当您输入信用卡号时，它将切换出一个显示输入信用卡图像的类。添加和删除类

如何每次清除信用卡以使新的信用卡出现？

<div> 
    <form> 
     <div id="ccc" class="form-group add-on"> 
      <label for="ccnumber">Credit card Number</label> 
      <input type="text" class="form-control" id="credit-card" placeholder="Credit Card Number"> 
     </div> 
    </form> 
    <div id="output"></div> 
    <div id="c-card-type"></div> 
</div>

if(cardType == null){ 
     return; 
     }else{ 
     switch(cardType.name){ 
      case 'visa': 
      $('#output').html('This Card is visa'); 
      $('#c-card-type').toggleClass('c-card vs'); 
      break; 
      case 'mastercard': 
      $('#output').html('This Card is mastercard'); 
      $('#c-card-type').toggleClass('c-card mc'); 
      break; 
      case 'ax': 
      $('#output').html('This Card is ax'); 
      $('#c-card-type').toggleClass('c-card ax'); 
      break; 
      default: 
      $('#output').html('We dont support ' + cardType.name); 
     } 
     }

来源

2016-11-07 ottz0

这个问题是不明确的给我。你能否提供完整的html和js代码以便更好地理解？我没有得到任何你提到的问题。 – Ari4

从你的代码toggleClass不会单独工作，请参阅toggleClass
的下面的例子

<div id='mydiv' class="class1"></div> 
$('#mydiv').toggleClass('class1 class2'); 
output: <div id='mydiv' class="class2"></div>

所以，你需要删除或在if语句之前清空类属性或添加到每个案例。

$('#c-card-type').attr('class',''); 
or 
    $('#c-card-type').removeAttr('class');

现在你的代码应该是

$('#c-card-type').attr('class',''); 
if(cardType == null){ 
     return; 
     }else{ 
     switch(cardType.name){ 
      case 'visa': 
      $('#output').html('This Card is visa'); 
      // $('#c-card-type').attr('class',''); 
      $('#c-card-type').toggleClass('c-card vs'); 
      break; 
      case 'mastercard': 
      $('#output').html('This Card is mastercard'); 
      // $('#c-card-type').attr('class',''); 
      $('#c-card-type').toggleClass('c-card mc'); 
      break; 
      case 'ax': 
      $('#output').html('This Card is ax'); 
      // $('#c-card-type').attr('class',''); 
      $('#c-card-type').toggleClass('c-card ax'); 
      break; 
      default: 
      $('#output').html('We dont support ' + cardType.name); 
     } 
     }

我希望这会帮助你。

来源

2016-11-07 04:21:34 Sathish

谢谢，我得到removeAttribute（）不是一个函数，所以我用removeAttr（） – ottz0

您可以使用addClass与removeClass为此目的

上的卡式例如：签证，签证添加类和删除等卡类。

var cardTypeObj= $('#c-card-type'); 
    if(cardType == null){ 
     return; 
     }else{ 
      cardTypeObj.addClass('c-card') 
     switch(cardType.name){ 
      case 'visa': 
      $('#output').html('This Card is visa'); 
      cardTypeObj.addClass('vs'); 
      cardTypeObj.removeClass('mc ax'); 
      break; 
      case 'mastercard': 
      $('#output').html('This Card is mastercard'); 
      cardTypeObj.addClass('mc').removeClass('vs ax'); 
      break; 
      case 'ax': 
      $('#output').html('This Card is ax'); 
      cardTypeObj.addClass('ax').removeClass('mc vs'); 
      break; 
      default: 
      $('#output').html('We dont support ' + cardType.name); 
     } 
     }

希望这有助于

来源

2016-11-07 04:23:07 Geeky

添加和删除类

回答

相关问题