2013-03-09 43 views
0

我有這個非常簡單的jQuery腳本來改變基於鏈接的模態內容。代碼:重新加載模態內的模態點擊

$('#facebook-friends').on('hidden', function() { 
    $(this).removeData('modal'); 
}); 

,然後我可以控制哪些內容將被使用的基礎上,按鈕:

<a href="facebook-frame.php" id="full-width" data-target="#facebook-friends" role="button" class="btn btn-primary" data-toggle="modal"><i class="icon-facebook"></i> Use Facebook</a> 

它完美!但是,我在此facebook-frame.php文件中有鏈接,並且我希望所有操作都保留在模式中,以便外部頁面不會重新加載。

我試過facebook-frame.php這個解決方案,但它不起作用。

<a href="facebook-frame.php?all" data-target="#facebook-friends" role="button" class="btn btn-primary" data-toggle="modal"> 

這是我的炫魅模態:

<div class="modal fade hide" id="facebook-friends" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" > 
    <div class="modal-header"> 
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> 
    <h3 id="myModalLabel">Inviter veninder fra Facebook</h3> 
    </div> 
    <div class="modal-body text-center"> 
    <p>Loading content...</p> 
<p><IMG src="ajax-loader.gif"></p> 
    </div> 
    <div class="modal-footer"> 
    <button class="btn" data-dismiss="modal" aria-hidden="true">Luk</button> 
    </div> 
    </div> 

我特別喜歡「加載內容」,因爲它看起來非常動感。

有什麼辦法給facebook-frame.php裏面的鏈接/按鈕分配一個特殊的命令/類/名稱,這樣當點擊它時會臨時顯示「加載內容」,然後同時加載請求的頁面(在href屬性中)?

回答

0

如果我理解正確,在facebook-frame.php裏面你能捕獲所有的<a>(或者具體的<a>類)點擊事件嗎?

$(document).on('click', '#facebook-friends a', function(e) { 
    e.preventDefault(); 
    // show the "Loading content" message 
    // load the content and whatever else you need to do 
}); 

注意:.on()需要jQuery 1.7+。在此之前,你會使用.live()