jQuery Featherlight與API的內容，加載第二次點擊

我調用一個函數來寫入一個JSON字符串在燈箱中的內容。我有我的功能，工作和填充收藏夾，當我使用下面的jQuery Featherlight與API的內容，加載第二次點擊

<a data-featherlight="<div id='dataplan_list_container'><table id='dataplan_list'></table></div>" onclick="dataPlanOutput('FR');" data-target="data_plan">France</a>

但是我不想每一個環節都包含

data-featherlight="<div id='dataplan_list_container'><table id='dataplan_list'></table></div>"

我試圖創建頁面上的目標DIV與

<a data-featherlight="#dataplan_list_container" onclick="dataPlanOutput('FR');" data-target="data_plan">France</a> 
<div id='dataplan_list_container'><table id='dataplan_list'></table></div>

但是，當我第一次使用這個時，我點擊鏈接燈箱加載空。

我可以在JavaScript中設置模板並在點擊時動態調用它嗎？

來源

2016-12-01 Jody Sergison

工作的例子嗎？ –

您是否在$(document).ready()上使用ligthbox，以便加載所有DOM內容？如果不是，那麼考慮使用它。

你也可以manually bind所有鏈接到需要的內容：

function dataPlanOutput(loc) {} 
 

 
$('a.fl').featherlight({ 
 
    targetAttr: 'href' 
 
});

body>#dataplan_list_container { 
 
    display:none 
 
} 
 
#dataplan_list_container { 
 
    width: 200px; 
 
    height: 100px; 
 
} 
 
#dataplan_list { 
 
    margin: 10px; 
 
    width: 180px; 
 
    height: 90px; 
 
    background: repeating-linear-gradient(45deg, #606dbc, #606dbc 10px, #465298 10px, #465298 20px); 
 
}

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="//cdn.rawgit.com/noelboss/featherlight/1.6.1/release/featherlight.min.js"></script> 
 
<link type="text/css" rel="stylesheet" href="//cdn.rawgit.com/noelboss/featherlight/1.6.1/release/featherlight.min.css" /> 
 

 

 
<a class="fl" href="#dataplan_list_container" onclick="dataPlanOutput('FR');" data-target="data_plan">France</a><br> 
 
<a class="fl" href="#dataplan_list_container" onclick="dataPlanOutput('RU');" data-target="data_plan">Russia</a><br> 
 
<div id='dataplan_list_container'><table id='dataplan_list'></table></div>

來源

2016-12-01 18:23:10 Annarfych

jQuery Featherlight與API的內容，加載第二次點擊

回答

相關問題