jQuery Elementselektoreinrichtung Problem

Question

Mein Problem ist ein wenig kompliziert.

Ich habe den folgenden Code:

$(document).ready(function() {

    var hash = window.location.hash.substr(1);
    var href = $('#nav li a').each(function(){
        var href = $(this).attr('href');
        if(hash==href.substr(0,href.length-5)){
            var toLoad = hash+'.html #content';
            $('#content').load(toLoad)
        }                                           
    });

    $('#nav li a').click(function(){

        var toLoad = $(this).attr('href')+' #content';
        $('#content').hide('fast',loadContent);
        $('#load').remove();
        $('#wrapper').append('<span id="load">LOADING...</span>');
        $('#load').fadeIn('normal');
        window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);
        function loadContent() {
            $('#content').load(toLoad,'',showNewContent())
        }
        function showNewContent() {
            $('#content').show('normal',hideLoader());
        }
        function hideLoader() {
            $('#load').fadeOut('normal');
        }
        return false;

    });

});

Okay, zuerst ist es nicht mir, wer es codiert, so dass ich wirklich nicht verstehen, was es tut, und auch habe ich versucht, es zu ändern, aber ich war nicht erfolgreich. Der Code wird wählen Sie einen Link ‚nav li‘ und die Seite in einer AJAX Art und Weise angezeigt werden, diese Mittel ohne es neu zu laden. Es tut dies richtig :) Nun, alles, was ich will es tun ein fancybox registrieren Benutzer hinzuzufügen. Um dies zu tun, ich sollte den folgenden Code hinzufügen.

$("a#reg").fancybox({
    'hideOnContentClick': false
});

Jetzt habe ich nur den Code in $ document.readyfunction setzen und die Phantasie-Box funktioniert wie es sollte, auch der nav li Links funktionieren gut. Also, wo ist das Problem? wenn ich einen ‚nav li‘ Link klicken und den Inhalt laden und anschließend nochmals auf denen die Heimat-Verbindung, (I zur ersten Seite zurück), nicht die Phantasie-Box mehr funktioniert. Ich weiß, dass es sehr empfindlich ist, so kann man schlecht verstanden es, so lassen Sie es mich auf eine andere Weise erklären. Ich habe sowohl die Wähler der ‚nav li‘ und dem Selektor der fancy box Verbindung, was die beste Methode, sie arbeitet zusammen ??

zu machen ist

Auch kann mir jemand erklären, was der Code als auch der Fall ist.
Danke.

Answer 1

Ok ... Hier ist, was der Code tut:

    var hash = window.location.hash.substr(1);
    var href = $('#nav li a').each(function(){
        var href = $(this).attr('href');
        if(hash==href.substr(0,href.length-5)){
                var toLoad = hash+'.html #content';
                $('#content').load(toLoad)
        }                                                                                       
    });

In diesem ersten Teil erhalten die Hash der aktuellen Seite prüfen, ob einer der „nav li“ Links endet mit diesem Hash (5 Zeichen erwartet), und wenn es der Fall ist, wird das #content Element der Seite hash + ".html" im #content Elemente der aktuellen Seite (ich nehme an, es ist ein div) geladen werden.

Stellen Sie die URL laden „ http: //.../page1.html#page2 “. Seite1 geladen wird, und dann, #content von page2.html wird von einem Ajax-Aufruf in #content von page1 geladen werden.

    $('#nav li a').click(function(){

        var toLoad = $(this).attr('href')+' #content';
        $('#content').hide('fast',loadContent);
        $('#load').remove();
        $('#wrapper').append('<span id="load">LOADING...</span>');
        $('#load').fadeIn('normal');
        window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);
        function loadContent() {
                $('#content').load(toLoad,'',showNewContent())
        }
        function showNewContent() {
                $('#content').show('normal',hideLoader());
        }
        function hideLoader() {
                $('#load').fadeOut('normal');
        }
        return false;

    });

Dies wird das folgende Verhalten zu „nav li“ Links hinzufügen: bei Anklicken die „Lademeldung“ zeigen und die #content der Zielseite in #content Elemente der aktuellen Seite laden

.

Ich habe keine Ahnung, warum dieses Skript trotz schrecklich sein, verursachen würde Ihre fancybox nicht zu zeigen. Meine Vermutung ist, dass die „nav li“ Links, um den Inhalt mit einem Ajax-Aufruf geladen werden, und dies wird Ihre fancybox nicht beeinflussen, die bereits geladen ist, aber wenn Sie das Haus Link klicken, wird die Seite komplett neu geladen und der fancybox Code nicht ausgeführt, aus einem Grund. Sie können das überprüfen, indem Sie eine einfache Benachrichtigung hinzufügen:

alert("initializing fancybox");
$("a#reg").fancybox({
    'hideOnContentClick': false
});

Wenn die ganze Seite neu geladen wird, wenn Sie das Haus Link klicken, und diese Warnung Popup nicht, dann sind Sie die Ursache des Problems.