jQuery facebox werkt niet met DD Ajaxtabs, welke oplossing?

Nadat ik mijn haren voor de laatste 2 uur had uitgetrokken, kon ik het conflict nog steeds niet ontdekken. Help me alstublieft bij het oplossen van dit probleem. Ik gebruik http://www.dynamicdrive.com/dynamicindex17/ajaxtabscontent/ajaxtabs_suppliment3.htm om ajax-tabbladen voor mijn sites te maken en ook met http://defunkt.io/facebox/ voor modale vensters. Maar wanneer ik facebox-links probeer te laden die zijn geladen via de ajax-tabbladen, wordt de inhoud niet in de facebox geladen. Maar het werkt prima voor alle links buiten de ajax-tabbladen. Enig idee?

0

1 antwoord

Dit is eenvoudig te wijten aan het feit dat voor nieuwe inhoud die u in de DOM laadt, geen eerder ingestelde gebeurtenishandlers zijn gekoppeld.

Dus in dit geval wordt uw facebox-plugin geïnitialiseerd voordat de nieuwe inhoud wordt geladen in de ajax-tabbladen. Daarom weet in feite de facebox-plug-in niet dat deze nieuwe koppelingen bestaan.

Het antwoord is om de plug-in opnieuw te initialiseren nadat de nieuwe inhoud is geladen.

Dus u moet bellen: -

  $('a[rel*=facebox]').facebox()

... nogmaals, zodra de nieuwe ajax-tabbladen inhoud in de DOM is geladen. Na een korte blik op het script met de ajax-tabbladen kan ik je voorstellen dit probleem eenvoudig op te lossen door de facebox-plug-in (zoals hierboven weergegeven) opnieuw te initialiseren door die regel toe te voegen aan een functie die telkens wordt aangeroepen wanneer nieuwe inhoud in een ajax-tabblad wordt geladen.

Alternatively (and far more simply) you could initialise the facebox plugin using the jQuery livequery plugin

Gebruik deze code (zodra u het livequery-script op uw site hebt opgenomen: -

$('a[rel*=facebox]').livequery(function() {

$(this).facebox();

});

Livequery detecteert vervolgens automatisch de nieuw geladen facebox-links wanneer deze aan de DOM worden toegevoegd en past de facebox-plug-in toe voor u.

BEWERK:

Als dit nog steeds niet het gewenste effect heeft (hoewel ik echt niet kan zien waarom het niet als live-vraag was toen ik het gebruikte was het een droom) probeer deze vuile kleine hack om facebox elke keer te ontbinden en opnieuw te verbinden elke keer dat je de muis naar beneden gooit. Op elke facebox-link, nieuw of oud.

$('a[rel*=facebox]').live("mousedown", function() { 
    $(this).unbind('click'); //everytime you click unbind the past event handled.
    $(this).facebox();
});
2
toegevoegd
Ik heb zojuist mijn anwser bijgewerkt met een derde oplossing die, hoewel een beetje een hack ... de truc voor je zou moeten doen.
toegevoegd de auteur gordyr, de bron
De live query-oplossing werkt soms. Soms faalt het. Mag ik weten waar moet ik de eerste oplossing toevoegen?
toegevoegd de auteur user632347, de bron