jquery entrée non vérifiée changement de chemin d'image

Question

Je ne sais pas comment cela fonctionne, alors j'espère que vous pouvez m'aider. Je veux changer le chemin de l'image de mes images, si le champ de saisie est décoché. Si cette case est cochée, cela a changé le chemin d'accès à une image colorée, cela fonctionne bien pour moi, mais si je choisis une autre image, l'image avant devrait revenir à une image en noir et blanc.

Merci d'avance!

Voici le code html:

$('input[name=an_paymentOptionsControl]').on('change', function() { 
 
    $(this).siblings('img').attr('src', 'pics/payment-large/' + this.getAttribute('value') + '.png'); 
 
    console.log(this.getAttribute('value')); 
 
}); 
 

 
$('input[name=an_paymentOptionsControl]').not(':checked', function() { 
 
    $('img').attr('src', 'pics/payment-large/sw' + this.getAttribute('value') + '.png'); 
 
    console.log('nix'); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<div class="anm-payment-layout-methods"> 
 
    <label> 
 
      <input class="anm-pay-method" type="radio" value="acc" name="an_paymentOptionsControl" /> 
 
      <img class="paymentLabel" src="pics/payment-large/swacc.png"> 
 
     </label> 
 
    <label> 
 
      <input class="anm-pay-method" type="radio" value="paypal" name="an_paymentOptionsControl" /> 
 
      <img src="pics/payment-large/swpaypal.png"> 
 
     </label> 
 
    <label> 
 
      <input class="anm-pay-method" type="radio" value="sue" name="an_paymentOptionsControl" /> 
 
      <img src="pics/payment-large/swsue.png"> 
 
     </label> 
 
    <label> 
 
      <input class="anm-pay-method" type="radio" value="giropay" name="an_paymentOptionsControl" /> 
 
      <img src="pics/payment-large/swgiropay.png"> 
 
     </label> 
 
    <label> 
 
      <input class="anm-pay-method" type="radio" value="prepay" name="an_paymentOptionsControl" /> 
 
      <img src="pics/payment-large/swprepay.png"> 
 
     </label> 
 
</div>

Answer 1

Mise à jour le chemin d'images dans le gestionnaire d'événements change.

$('input[name=an_paymentOptionsControl]').on('change', function() { 
    $(this).siblings('img').attr('src', 'pics/payment-large/' + this.value + '.png'); 

    //Reset images 
    $('input[name=an_paymentOptionsControl]:not(:checked)').each(function() { 
     $(this).siblings('img').attr('src', 'pics/payment-large/sw' + this.value + '.png'); 
    }); 
});