Hinzufügen und Entfernen von Klassen

Ich habe ein jQuery Kreditkarten-Plugin und wenn Sie die Kreditkartennummer eingeben, schaltet es eine Klasse aus, die ein Bild für die eingegebene Kreditkarte anzeigt.Hinzufügen und Entfernen von Klassen

Wie lösche ich die Kreditkarte jedes Mal, damit das neue erscheint?

<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); 
     } 
     }

Quelle

2016-11-07 ottz0

Dieses Problem für mich nicht eindeutig ist. kannst du bitte vollständigen html und js code für besseres verständnis liefern? Ich bekomme kein Bild, das Sie in Ihrer Frage erwähnen. – Ari4

aus dem Code toggleClass nicht alleine arbeiten, benutzen Sie bitte das unten stehende Beispiel toggleClass

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

So müssen Sie entfernen sehen oder Leeren Sie das Klassenattribut vor der if-Anweisung oder fügen Sie es zu jedem Fall hinzu.

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

jetzt sollten Sie den Code

$('#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); 
     } 
     }

sein Ich hoffe, dies wird Ihnen helfen.

Quelle

2016-11-07 04:21:34 Sathish

Danke, ich habe removeAttribute() keine Funktion, also habe ich removeAttr() verwendet – ottz0

Sie addClass und removeClass zu diesem Zweck

auf einem Kartenart ex verwenden können: Klassen Visum, fügen Visum Klasse und entfernen Sie andere Karte.

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); 
     } 
     }

hoffe, das hilft

Quelle

2016-11-07 04:23:07 Geeky

Hinzufügen und Entfernen von Klassen

Antwort

Verwandte Themen