web-dev-qa-db-fra.com

Événement de chargement Jquery on () sur un seul élément

Je suis désolé si cette question a déjà été posée, mais je n'ai pas trouvé de solution.

J'ai 3 éléments radios et je veux vérifier la valeur lorsque la sélection change et lorsque la page se charge.

Je le ferais en utilisant uniquement la fonction on ().

Mon problème est que seul l'événement de changement est déclenché.

Voici mon code actuel :

$('.user').on('load change', function(){
  if($(this).val() == 'client'){ 
$('#user_parent').removeAttr('disabled').closest('tr').show(200);
}else{
  $('#user_parent').attr('disabled', 'disabled').closest('tr').hide(200);
}
});"

J'ai également essayé de remplacer la charge par prêt, mais cela a échoué aussi. Quel est le problème ? L'événement de chargement n'est-il pas disponible pour un seul élément?

Le code est placé dans $ (document) .ready (...), et les éléments sont tous affichés lors de l'envoi de la page.

Merci

jqueryeventsload
17
FLX

l'événement load sera appelé au moment où tous les éléments enfants de l'élément écouté seront chargés. dans votre cas, cela peut se produire avant l'appel de l'événement ready, rendant ainsi votre gestionnaire de chargement (qui est ajouté après document.ready) inutile.

pour référence voir JQuery api où vous trouverez les éléments suivants:

L'événement de chargement est envoyé à un élément lorsqu'il et tous les sous-éléments ont été complètement chargés. Cet événement peut être envoyé à tout élément associé à une URL: images, scripts, cadres, iframes et l'objet fenêtre.

cela signifie également que vous avez besoin d'une URL, afin que vous puissiez écouter l'événement de chargement. comme vous n'avez pas fourni de code supplémentaire, je suppose que vous avez effectivement une URL que vous pouvez écouter.

Cela pourrait être la cause la plus probable. si aucune URL n'est associée à (au moins un) élément (s) enfant , il n'y aura pas événement de chargement que vous pouvez écouter.

essayez ceci à la place:

$(document).ready(function(){
   checkUserVal();
   $('.user').on('change', checkUserVal);
});

var checkUserVal = function(){
  //do the check
  if($('.user').val() == 'client'){ 
     $('#user_parent').removeAttr('disabled').closest('tr').show(200);
  }else{
     $('#user_parent').attr('disabled', 'disabled').closest('tr').hide(200);
  }
};

j'ai fait du code une méthode pour une meilleure lisibilité;)

20
Vogel612

Comme Vogel612 expliqué , load ne se déclenche pas pour la plupart des éléments.

ready est uniquement pour document.

Vous pouvez utiliser each pour exécuter initialement votre gestionnaire d'événements.

$(document).ready(function(){
  $('.user')
    .each(user_handler)
    .on('change', user_handler);
});

var user_handler = function(){
  // this
};
5
Vezquex