javascript - jQuery lightbox(featherlight) 不适用于点击事件

Question

我正在使用featherlight轻量级 jQuery 灯箱插件，但我不明白如何使用单击事件加载灯箱，因为我不擅长 jQuery 代码。

这是我的代码工作:

HTML:

<a href="#" data-featherlight="#fl1">Load Lightbox</a>
<button id="openbox">Load Lightbox on click event</button>

<div class="lightbox" id="fl1">
    <h2>Delete Item</h2>
    <div class="row">
        <div class="twelve columns">
            <strong>Are you Sure?</strong>
            <br>blubblub?
        </div>
    </div>
    <div class="right"> <a href="#" class="btn btn_gray no text_none" id="close_button">Close</a>
    <a href="#" class="btn btn_red text_none">Yes</a>
    </div>
</div>

jQuery:

jQuery(document).on("click", "#openbox", function() {
    jQuery('.lightbox').featherlight();
});

JSFiddle:jsfiddle.net/g68bZ/18/

评论回复:

但是如果我想显示具有逻辑条件的灯箱，例如:

var checkedCount = $('.chkAssets:checked').length; // Getting some counts

if(checkedCount == 1){
    // Load lightbox if condition is match
}

我希望有人指导我正确的方式。

谢谢。

Answer 1

     $.featherlight('#fl1');

注意灯箱的 ID 为“fl1”

这是 fiddle http://jsfiddle.net/g68bZ/26/

这里是 if else 的例子 http://jsfiddle.net/g68bZ/27/