سؤال

ومشكلتي هي معقدة بعض الشيء القليل.

ولدي البرمجية التالية:

$(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;

    });

});

حسنا، أولا أنها ليست لي الذي مشفرة، لذلك أنا حقا لا أفهم ما تقوم به، وكذلك حاولت تغييره لكني لم ينجح. سوف رمز اختيار رابط 'الملاحة لى "وعرض الصفحة بطريقة AJAX، وهذا يعني من دون إعادة تحميلها. وهي تفعل ذلك بشكل صحيح :) الآن، كل ما تريد أن تفعل ذلك لإضافة fancybox لتسجيل المستخدمين. للقيام بذلك وأود أن أضيف التعليمة البرمجية التالية.

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

والآن أنا فقط وضعت التعليمات البرمجية في $ document.readyfunction ويعمل مربع يتوهم كما ينبغي، أيضا الروابط لى الملاحة يعمل بشكل جيد. فأين هي المشكلة؟ عند النقر على رابط 'الملاحة لى "وتحميل المحتوى ومن ثم انقر مرة أخرى على الرابط المنزل، (I العودة إلى الصفحة الأولى)، مربع يتوهم لم يعد يعمل. وأنا أعلم أنه حساس جدا لذلك قد يكون لديك سوء فهمه، لذلك اسمحوا لي أن أشرح ذلك بطريقة أخرى. لدي كل محدد من 'لى الملاحة "ومحدد من الارتباط مربع الهوى، ما هي أفضل طريقة لجعلها تعمل جنبا إلى جنب ؟؟

وأيضا يمكن للشخص أن يفسر لي ما يقوم به كود كذلك.
شكرا لك.

هل كانت مفيدة؟

المحلول

طيب ... هنا هو ما يفعله رمز:

    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)
        }                                                                                       
    });

وهذا الجزء الأول سوف تحصل على التجزئة الصفحة الحالية، تأكد من أن واحدة من الروابط "الملاحة لي" ينتهي هذا التجزئة (المتوقع 5 أحرف)، وإذا كان هذا هو الحال، سيتم تحميل العنصر #content الصفحة hash + ".html" في العنصر #content الصفحة الحالية (افترض انها شعبة).

وتخيل أنك تحميل رابط " HTTP: //.../page1.html#page2 ". سيتم تحميلها Page1 و ذلك الحين، سيتم تحميلها #content من page2.html بواسطة مكالمة اياكس في #content من page1.

    $('#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;

    });

وهذا سيضيف السلوك التالي إلى "الملاحة لي" الروابط: عند النقر عليها، تظهر "رسالة تحميل" وتحميل #content الصفحة الهدف في العنصر #content الصفحة الحالية

.

وليس لدي أي فكرة لماذا هذا السيناريو، على الرغم من كونه الرهيبة، من شأنه أن يسبب fancybox الخاص بك لا تظهر. تخميني هو أن "الملاحة لي" الروابط سيتم تحميل المحتوى مع مكالمة اياكس وهذا لن يؤثر على fancybox الخاص بك، والتي يتم تحميلها بالفعل، ولكن عند النقر فوق الارتباط المنزل، الصفحة يتم إعادة تماما ورمز fancybox ليس أعدم، لسبب ما. يمكنك التحقق من ذلك عن طريق إضافة تنبيه بسيط:

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

وإذا كانت صفحة كاملة يتم إعادة تحميل عند النقر فوق الارتباط المنزل، وهذا التنبيه لا منبثقة، يمكنك العثور على سبب المشكلة.

scroll top