Jquery error "u is undefined"

Why am I getting an error in Firebug "u is undefined"?

My page consists of a display of photos and photo gallery as a special separate section in the PHP code divided using the "break".

Photos and photo galleries are displayed using the "Fancybox.js".

The first time when I try to open a photo, everything works fine but when I do it again after I refresh the page the Firebug display error "u is undefined".

The Jquery for the menu that I'm using for display these separate 开发者_运维百科part of the page:

$(document).ready(function(){

$(".menu_rfr").bind('click', function() {
$("#main").html('<img src="img/spin.gif" class="spin">');
location.replace($(this).attr('rel'));

});

$(".menu_clickable").bind('click', function() {
$("#main").html('<img src="img/spin.gif" class="spin">');
$("#main").load($(this).attr('rel'), function(event) {

});        
$(".menu_clickable").unbind("click");

});

});

The simplified PHP code looks like:

<?
if (!isset($a)) $a = '';
switch($a)
{
case 1:
default:
?>
<div class="menu_clickable prof_link" id="prof_info" rel="?a=2">Photos</div>
<div class="menu_clickable prof_link" id="prof_info" rel="?a=3">Gallery</div> 
<div id="main"></div>    
<?
break;//photos
case 2:
?>
<script type="text/javascript"> 

$("a.group").fancybox({
'titlePosition'     : 'over',
'overlayShow':false
 });
 </script>
 <?
 <a href="1.jpg" id="group" class="group"><img src="tmb/1.jpg" border="0"></a>
 <?
 break;
 case 3: // photo gallery 
 ?>
<script type="text/javascript"> 

$("a.groupg").fancybox({
'titlePosition'     : 'over',
'overlayShow':false
 });
 </script>
 <?
 <a href="2.jpg" id="groupg" class="groupg"><img src="tmb/2.jpg" border="0"></a>
 <?
 break;
 }
 ?>

As I said this is a simplified code, and probably there are some errors in it. I just wanted to show where and how I'm using Fancybox.

Is there a conflict between the jquery code for the menu at the top of the page and this for fancybox or there is some other reason why I keep getting an error in Firebug "u is undefined" after opening the other part of the PHP page and attempts to re-opening photos?

View your HTML source and make sure you don't have FancyBox declared twice. I just had the exact same error pop up in firebug and this is what I found in my source:

<script language="javascript" type="text/javascript" src="./ext_scripts/jquery.fancybox-1.3.1/fancybox/jquery.fancybox-1.3.1.pack.js"></script>

<link rel="stylesheet" href="./ext_scripts/jquery.fancybox-1.3.1/fancybox/jquery.fancybox-1.3.1.css" type="text/css" media="screen" />  
<script language="javascript" type="text/javascript" src="./ext_scripts/jquery.fancybox-1.3.1/fancybox/jquery.fancybox-1.3.1.pack.js"></script>

Not sure exactly why it happened, but if you nest your include and require_onces in your PHP like I unfortunately did, you can wind up with some very funky Javascript references.

You probably have the fancybox.js script included twice which is causing the issue. Please check all your files and remove the the ones that are not required.

I have this same bug as well - I think it is due to the the 'loading' divs being reset by the cleanup code. I have a VERY nasty fix:

Change:

if ($("#fancybox-wrap").length) {
   return;

To: (To skip the multiple-init check)

if (false && $("#fancybox-wrap").length) {

And add:

$.apzFancyboxInit = fancybox_init;

after 'fancybox_init = function() {'

What this does is allow us to call the initialisation routine multiple times; and saves the function pointer to this routine in a global variable. All we have to do now is make sure we call the $.apzFancyboxInit function every time a fancybox is closed. The best place to do this is in the onClosed function handler; so (in my case), my calls look like this:

        $.fancybox(
        {
            'showCloseButton' : true,
            'type' : 'ajax',
            'onClosed' : function()
            {
                $.apzFancyboxInit();
            },

If you are using a "ripped" template you may find that there are the fancybox generated div written in tho the html template right above the </body> tag.

check if your html output has a div with the id of fancybox-wrap if you have JavaScript disabled, and remove that.