2014-07-12 46 views
0

我想要fancyBox(FB從現在開始)工作,並不能得到它。我會在下面解釋我的工作。首先是,當然也包括在FB腳本和樣式如下:fancybox與AJAX加載內容不起作用

<!-- fancyBox styles --> 
<link href="//cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/jquery.fancybox.min.css" rel="stylesheet"> 
<link href="//cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/helpers/jquery.fancybox-buttons.css" rel="stylesheet"> 
<link href="//cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/helpers/jquery.fancybox-thumbs.css" rel="stylesheet"> 

<!-- fancyBox JS --> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
<script src="//code.jquery.com/jquery-migrate-1.1.1.min.js"></script> 
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script> 
<script src="//cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/jquery.fancybox.min.js"></script> 
<script src="//cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/helpers/jquery.fancybox-buttons.js"></script> 
<script src="//cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/helpers/jquery.fancybox-media.js"></script> 
<script src="//cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/helpers/jquery.fancybox-thumbs.js"></script> 
<script src="/app_dev.php/js/bmain_registro_2.js" type="text/javascript"></script> 

在我的HTML代碼,我有這樣的:

<a href="#" class="getregistered">Register</a> 
<div id="register"></div> 

因爲內容加載槽AJAX調用發出關於它的空您將在下面看到bmain_registro_2.js。然後在bmain_registro_2.js我寫這篇文章:

var $register = $("#register"); 

if ($register.length) { 
    $register.load(Routing.generate('datos-basicos')); 
} 

$("#tabs").tabs(); 

$('.getregistered').on("click", function() { 
    console.log("click"); 
    $("#register").fancybox({ 
     openEffect: 'elastic', 
     closeEffect: 'elastic', 
     autoSize: false, 
     closeClick: false 
    }); 
}); 

Routing.generate('datos-basicos')來自Symfony2中和FOSJsRoutingBundle,但它的工作很好,因爲我得到了我想要展示的模式的內容。問題?

  • 模態內容不隱藏(見下圖),我想應該是默認隱藏

enter image description here

  • 當我Register鏈接點擊console.log()代碼執行,但模式永不出現

我在這裏失蹤,是我的代碼ri GHT?

回答

1

你只需要到「的fancybox」類添加到鏈接如下: <a href="#" class="fancybox" >Register</a> 問候..