Comment emballer l'événement click avec une fonction personnalisée

Question

J'ai un bouton appelé « créer projet », lorsque l'utilisateur cliquez sur le bouton, je veux 2 choses se passent

1. un appel ajax pour vérifier si l'utilisateur est permettre de créer un projet
2. si autorisé, puis exécutez le bouton normalement, sinon, ouvrez une boîte de dialogue modale indiquant qu'il n'est pas autorisé à créer un nouveau projet.

J'ai le code suivant

dans le code ci-dessus

$('.create_project').click(function(e) { 
    e.stopDefault(); 
    $.getJSON('/check_user_limit', function(data){ 
     if(data.allow_to_create_project){ 
      //trigger the click here 
     }else{ 
      //modal here 
     } 
    } 
}); 

utilisation « déclencheur » ne fonctionnera pas, car il devient une boucle infinie. Le unbind fonctionne la première fois, mais ne fonctionnera pas la deuxième fois puisque le foo ne se lie plus à la fonction.

Answer 1

Je ne sais pas pourquoi vous ne voudriez pas faire simplement:

$('.foo').click(function(e) { 
    $(this).href = "/bar"; 
}); 

Answer 2

Il est assez simple, vous venez de faire ce qui suit:

$('.foo').click(function(e) { 
    $(this).href = "/bar"; # done something else before the click 

    return true; 
}); 

Si vous voulez intercepter le clic Événement et ne pas le propager puis retourner simplement false à la place. J'ai remarqué que vous avez rendu votre exemple plus explicite, mais la solution est encore assez similaire. Au lieu de renvoyer true pour propager l'événement, nous déclenchons manuellement le clic tout en demandant à la fonction click d'avaler l'événement en retournant false. Le code serait alors ressembler à ceci:

$('.create_project').click(function(e) { 
    $.getJSON('/check_user_limit', function(data) { 
     if (data.allow_to_create_project) { 
      e.click(); 
     } else { 
      //modal here 
     } 
    } 
    return false; 
}); 

Cependant, faire une demande AJAX pour vérifier si une fonctionnalité est utilisable est généralement pas une bonne idée. Si le serveur sait déjà que l'utilisateur ne peut pas créer un projet, alors pourquoi le bouton est-il cliquable en premier lieu? Mettez à jour le contrôle avec l'état approprié à la place.

Answer 3

Je suis un peu confus. Vous parlez de la déliaison, mais il n'y a pas de véritable désengagement des événements dans le code actuel.

Si vous essayez simplement d'exécuter un pré-clic de code sur un élément, vous vous y trompez.

$('.foo').click(function(e) 
{ 
    $(this).href = "/bar"; 
    return true; // this is implicit, but you could return false to cancel the event 
}); 

Si vous essayez de faire quelque chose d'autre, alors je préconiserais l'aide de deux événements distincts, l'un d'eux étant un nom d'événement personnalisé. Pourquoi s'embêter avec le code côté client pour cela?

Answer 4

Du point de vue de la convivialité, il serait préférable de vérifier les permissions des utilisateurs avec le code côté serveur et, en cas de problème, d'avoir un message à côté du bouton désactivé au moment du chargement de la page. Ce message mentionnerait également ce qui peut être fait pour permettre la création de projet pour cet utilisateur.

Il suffit parfois d'évaluer si un outil particulier est nécessaire pour atteindre un objectif.