Question

的问候。我正在使用像这样的php循环为我的表的每个元素生成一个.click事件：

<?php foreach ($elements as $element){ ?>
    var element_id = <?= json_encode($element['element_id']));?>;

    $('#'+element_id+'_button').click(function() {
        $('#'+element_id+'_interval').toggle();
        if ($(this).hasClass('active')){
            $(this).removeClass('active');
        }
        else{
            $(this).addClass('active');
        }
    });
    <?php }?>

问题是，当$('#'+element_id+'_interval').toggle();元素没有响应但是它正确地添加和删除了类时，有人会帮助我。

Answer 1

使用类，使代码更清晰，但是如果你必须这样做，你应该知道你的element_id变量经常被重写。

尝试类似：

<button class="toggler" data-target="#interval_1"></button>

$(".toggler").click(function (ev) {
    ev.preventDefault();
    var target = $(this).data("target"); // would return #interval_1
    $(target).toggle();

    if ($(this).hasClass('active')) {
        $(this).removeClass('active');
    } else {
        $(this).addClass('active');
    }
});

Answer 2

我建议你首先将你的php与你的javascript分开否则（在其他之间）将很难维持。

首先，您可以使用javascript进行循环

Answer 3

将绑定事件放入单独的方法中，并在document.ready脚本中调用该方法：

 $(document).ready(function() {
      bindBtns();
});

function bindBtns()
{
    <?php foreach ($elements as $element){ ?>
    var element_id = <?= json_encode($element['element_id']));?>;

    $('#'+element_id+'_button').click(function() {
        $('#'+element_id+'_interval').toggle();
        if ($(this).hasClass('active')){
            $(this).removeClass('active');
        }
        else{
            $(this).addClass('active');
        }
     });
     <?php }?>
}

使用PHP循环生成JavaScript代码时使用$（）。click（）的问题

3 个答案: