J'ai le marquillage suivant:
$("#accordion").accordion({ header: "h3", fillSpace: true, changestart: function(event, ui) { if (someConditionIsTrue()) { event.stopPropagation(); event.preventDefault(); return (false); } } });
10 Réponses :
J'ai trouvé une solution de contournement qui fonctionne dans mon contexte - j'évite de devoir annuler complètement l'événement en désactivant simplement les en-têtes H3 (après leur avoir donné un identifiant) si nécessaire:
HTML: P>
if (someConditionIsTrue()) { $("#relationshipsHeader").attr("disabled", "disabled"); // and so on... }
fonctionne pour moi. P> $ ("# accordéon .h3"). UNBIND ("Cliquez sur"); CODE> P>
N'est-ce pas $ ("# accordéon h3"). Unbind ("cliquer"); ???? Reportez-vous à jsfiddle.net/aravindtri/sdqf2
Avant Initing Accordion, ajoutez votre gestionnaire de clic personnalisé avec votre logique. stopimmediatepropagation strong> arrêtera l'événement
Je viens d'ajouter "this.option.disableabled = true;" au lieu de "E.StopimMédieIadiatePropagation ();" ce qui fonctionne vraiment bien.
Bien qu'il existe une réponse similaire de User438316, il a trop besoin de code inutile, renvoie false code> étant un jarring évident ... Que diriez-vous de:
$('#accordion .deleted').click(function(e) {
e.stopImmediatePropagation();
});
$('#accordion').accordion();
Retour Faux a un but, il a également été utilisé par l'auteur de la question.
J'avais besoin d'une dérivation de ce comportement parce que j'étais enchaînant dragge et accordéon. Je mettais ma solution ici pour que quiconque cherche la même solution.
Le comportement que j'essayais d'éviter de déclencher un changement d'accordéon après avoir glissé lorsque les en-têtes sont la poignée de l'accordéon et de l'amplification. Donc, chaque fois que vous faites glisser, il s'effondre la section de contenu actuellement expansée. P>
HTML: P>
$container.append($controls) .draggable({ handle: ':header', start: function(event, ui) { $(event.toElement).addClass('ui-dragging'); } }); $container.find(':header').click(function (event) { var $this = $(this); if ($(this).hasClass('ui-dragging')) { event.stopImmediatePropagation(); $this.removeClass('ui-dragging'); } }); $container.accordion({ collapsible: true, header: ':header' });
Je crée le contenu de l'accordéon de manière dynamique, alors contraignant l'appel de l'événement avant que l'accordéon ne soit généré ne fonctionne pas pour moi. J'ai donc essayé de contraignant la startimmediatepropagation après la création de l'accordéon et qui a travaillé pour moi. P>
$("#accordion h3").unbind("click"); Refer jsFiddle-accordion
Ce sont quelques années après que la question a été posée à l'origine et que j'utilise JQuery-UI 1.11.2, cela n'aurait donc pas été une réponse valide.
Mais c'est ce que j'ai trouvé pour travailler le mieux: < / p>
désactiver_this code> ou trouver une autre façon, vous pouvez sélectionner l'en-tête correspondant. LI>
-
Ajoutez ensuite cette ligne de code p>
XXX PRE> LI>
ol> Certaines méthodes mentionnées dans des réponses antérieures ( Bidind ("Cliquez sur") CODE> et E.StopimmediateIadiateIadiateIadiate () Code>) a travaillé pour moi dans le sens limité qu'ils ont empêché l'ouverture du panneau lorsque l'en-tête a été cliqué. Mais ma méthode présente 2 avantages supplémentaires: P>
-
arrête l'en-tête en prenant sur un style en surbrillance lorsqu'il clique sur. p> li>
-
donne l'en-tête un style désactivé. P> li>
ul>
beaucoup plus convivial. p> p>
Peut-être qu'il est disponible dans l'aîné Jqueryuis, mais si vous utilisez JQuery-UI 1.9.2 ou plus récent, vous pouvez désactiver l'accusé d'effondrement de l'accordéon dans l'événement Beforeactiver;
beforeActivate: function (event, ui) { event.preventDefault(); }