Question

我的灯箱代码是：

var $lightbox = $("<div class='lightbox'></div>");
var $img = $("<img>");
var $caption = $("<p class='caption'></p>");
$lightbox
    .append($img)
    .append($caption);
$('body').append($lightbox);
$('.gallery li').click(function (e) {
    e.preventDefault();
    var src = $(this).children('img').attr("src");
    var cap = $(this).children('img').attr("alt");
    $img.attr('src',src);
    $caption.text(cap);
    $lightbox.fadeIn('fast');
    $lightbox.click(function () {
        $lightbox.fadeOut('fast');
    });
});

我使用它来显示产品库，当您点击产品时，将显示带有标题和图像的灯箱。我还想添加一个按钮（添加到购物车），但它不起作用（Lightbox根本没有打开），我将代码更改为：

var btn = document.createElement("BUTTON");
$lightbox.append($img).append($btn).append($caption);

我需要添加什么或者我做错了吗？

Answer 1

你的变量是'btn'，但你试图附加'$ btn'。调和变量，它应该有效，假设你已经添加了按钮对象的属性... innerHTML et al。

使用js将按钮添加到灯箱中

1 个答案: