使用PHP循环生成JavaScript代码时，$（）.click（）出现问题

问候。 我正在使用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 }?>

var element_id=我建议您首先将php与javascript分开。

否则（在其他之间）将难以维护

首先，您可以使用javascript执行循环，我建议您首先将php与javascript分开。

否则（在其他之间）将难以维护

首先，您可以使用javascript执行循环，使用类可以使代码更简洁，但是如果必须这样做，您应该知道您的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');
    }
});


$（“.toggler”）。单击（函数（ev）{
ev.preventDefault（）；
var target=$（this）.data（“target”）；//将返回#interval_1
$（target.toggle（）；
if（$（this）.hasClass（'active'））{
$（this.removeClass（'active'）；
}否则{
$（this.addClass（'active'）；
}
});
使用类可以使代码更简洁，但是如果必须这样做，您应该知道元素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');
    }
});


$（“.toggler”）。单击（函数（ev）{
ev.preventDefault（）；
var target=$（this）.data（“target”）；//将返回#interval_1
$（target.toggle（）；
if（$（this）.hasClass（'active'））{
$（this.removeClass（'active'）；
}否则{
$（this.addClass（'active'）；
}
});
将绑定事件放入单独的方法中，并在文档中调用该方法。就绪脚本：

 $(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 }?>
}

$（文档）.ready（函数（）{
bindBtns（）；
});
函数bindBtns（）
{
var element_id=将绑定事件放入一个单独的方法中，并在文档中调用该方法。就绪脚本：

 $(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 }?>
}

$（文档）.ready（函数（）{
bindBtns（）；
});
函数bindBtns（）
{
var element_id=Woooo dude！！将php与Javascript混合在一起？这是新的！！：D你不能这么做！@Steve当然可以。php真的与此无关。请发布呈现的HTML。不要以他试图的方式发布，除非他试图动态生成一个.JS文件…@Steve，是的，你可以使用php生成一个包含渲染后将运行的javascript。我看到你的困惑。：）我使用这种方法处理复杂的google maps javascript。Woooo dude！！将php与javascript混合在一起？这是新的！！：D你不能这样做！@Steve当然可以。php真的与此无关。请发布渲染的HTML。不要以他试图的方式发布，除非s他正在尝试动态生成一个.JS文件…@steve，是的，你可以使用php生成一个html页面，其中包含渲染后将运行的javascript。我看到了你的困惑。：）我使用这个方法处理复杂的google maps javascript。到目前为止，我有352个元素，而且会越来越大，我需要用php循环来完成。实际上你根本不需要循环，看看@cernunnos Answer我到目前为止有352个元素，而且会越来越大，我需要用一个php循环来实现这一点。实际上你根本不需要循环，看看@cernunnos Answer我有我的循环。ready（）工作正常，.click分别对每个元素执行，但如果是word，则不切换。您可以发布2-3个按钮的html输出，包括您要切换的对象吗？I have my loop in.ready（）工作正常，.click分别对每个元素执行，但如果是word，则不切换。您可以发布2-3个按钮的html输出，包括要切换的对象吗