Question

我的HTML结构如下：

<div class="parent">
    <span class="read_more">Read More</span>
    <div class="hidden description" id="description1">Description</div>
</div>
..
<div class="parent">
    <span class="read_more">Read More</span>
    <div class="hidden description" id="description2">Description</div>
</div>

如果我将ID分配给每个描述div

，我的Js代码适用于id

$(".read_more").on("click", function (e) {
    var href = '#'+$(this).next().attr('id');
    $(this).colorbox({ inline: true, href: href });
});

我正在使用ColorBox插件。

当我点击阅读更多时，我需要弹出描述。我能够使用id来实现这一点，并且我不想在描述中给出id，因为这是动态生成的。我怎么能用课来实现呢？这可能吗？

任何帮助表示赞赏！

Answer 1

ColorBox也接受HTML。试试下面的

$(".read_more").on("click", function (e) {
    var html = '#'+$(this).next().html();
    $(this).colorbox({ inline: true, html: html });
});

Answer 2

如果您的css课程已隐藏＆＃39;适用display：none;试试这个

css：

.not_hidden { display:block }

jquery的

$('.read_more').click(function(){ 
      $(this).next('.description').addClass('not_hidden')
})

编辑使用类。

Answer 3

解决！

对不起我应该更加关注文档。

// Using a jQuery object:
$(".read_more").on("click", function (e) {
    e.preventDefault();
    var $desc = $(this).next();
    $(this).colorbox({ inline: true, href: $desc });
});

ColorBox - 如何使用类显示div

3 个答案: