Question

我想使用jQuery打开和关闭div。但是因为我使用的代码是动态的并且将在彼此之下重复，所以我需要使用动态id。

HTML：

<div class="categoryratings-review-<?php echo $this->htmlEscape($_review->getId())?>" style="display: none;">
   <p>Text</p>
</div>

<span class="showcategoryratings" id="review-<?php echo $this->htmlEscape($_review->getId())?>">
   <span class="showcategoryratings-text">Per category</span>
</span>

我尝试使用这个jQuery，但我猜php行无效：

$(document).ready(function() {
    $('#review-<?php echo $this->htmlEscape($_review->getId())?>').click(function() {
            $('.categoryratings-review-<?php echo $this->htmlEscape($_review->getId())?>').slideToggle("fast");
            $(this).toggleClass('active');
    });
});

我如何正确编辑？

Answer 1

你可以在Javascript中不用PHP来实现。

$(document).ready(function() {
    $('.showcategoryratings').click(function() {
        var categoryId = $(this).attr('id').split('-')[1];

        $('.categoryratings-review-'+categoryId).slideToggle("fast");
        $(this).toggleClass('active');
    });
});

我认为它有效。

Answer 2

如果您将元素分组如下，则会更容易。通过这样做，您根本不需要CREATE INDEX CONCURRENTLY shop_product_fields_index ON shop_product (id, ...);。看一看。

ID

$(document).ready(function() {
    $('.showcategoryratings').on("click", function() {
        $(this).closest(".group").find(".categoryratings-review").slideToggle("fast");
        $(this).toggleClass('active');
    });
});

Answer 3

您可以连接以review-开头的所有ID来回复

 $('[id^="review-"]').click(function() {

    $( '.categoryratings-' + $(this).attr('id') ).slideToggle('fast') ;

    $( this ).toggleClass('active');

 });

jquery open div with dynamic id

3 个答案: