web-dev-qa-db-fra.com

Désactiver et activer le bouton d'envoi dans jQuery

J'utilise jquery pour désactiver le bouton d'envoi et charger l'image de chargement,

Dans le bouton d'envoi, j'utilise ce qui suit: 

<div id="registerbtn" name="registerbtn">
<input type="submit" class="btn btn-primary" icon="ok white" value="Register" id="register" name="register"/>
</div>
<div class="span4" style="display:none;" id="loadingtext">
                            <?php echo  $imghtml=CHtml::image('images/loading.gif');?>                      
                        </div>

et dans JQuery, j'utilise le code suivant:

$(document).ready(function() {

    $('#register').click(function() {
        $('input[type="submit"]').attr('disabled','disabled');

     });
        $("#loadingtext").show();
    });
});

Lorsque je fais cela, alors ce bouton est désactivé de manière permanente, mais si je veux supprimer, que dois-je faire?

jqueryhtmlcssyii
13
Rohitashv Singhal

Utilisez .prop() method et utilisez la fonction $(this) pour référencer l'élément cible dans la fonction de rappel

jQuery(function($) {

  const $register = $("#register"),
        $loading = $("#loading");

  $register.on("click", function() {
  
    $(this).prop('disabled', true);
    $loading.show();
    
    setTimeout(function() {
      $register.prop('disabled', false);
      $loading.hide();
    }, 2000);

  });

});
<input id="register" value="Register" type="submit">
<div id="loading" style="display:none;">Wait 2 sec...</div>


<script src="//code.jquery.com/jquery-3.1.0.js"></script>

15
Roko C. Buljan

Ceci est répondu dans jQuery FAQ

Comment puis-je désactiver/activer un élément de formulaire?
Il existe deux façons de désactiver/activer les éléments de formulaire.

Définissez l'attribut 'disabled' sur true ou false:

 // Disable #x
 $('#x').attr('disabled', true);
 // Enable #x
 $('#x').attr('disabled', false);

Ajouter ou supprimer l'attribut 'désactivé':

 // Disable #x
 $("#x").attr('disabled', 'disabled');
 // Enable #x
 $("#x").removeAttr('disabled');

Update: Le moyen de le faire (comme le dit la FAQ) est seulement:

// Disable #x
$( "#x" ).prop( "disabled", true );

// Enable #x
$( "#x" ).prop( "disabled", false );
7
Olaf Dietsche

Pour supprimer définitivement le bouton

$('#register').remove();

Pour restaurer le bouton

$('#register').attr('disabled',false);
0
PassKit

Est-ce que $('#divID').remove(); est ce que vous cherchez?

http://docs.jquery.com/Manipulation/remove

0
Ignacio Correia