Question

这是我的php / javascript代码。我试图在循环中编写脚本，但它不起作用。这会生成两个按钮，一个用于本地团队，一个用于处理本地团队，另一个用于道路团队，同时处理道路团队。这些按钮显示包含在不同类的div中的信息。出于某种原因，它只适用于本地团队，它是循环的第一次迭代。

我已经阅读了很多关于使用id而不是类的人，但这不是我的情况。我很失落。

非常感谢你的帮助。

<script>
    $(".showavgloc").click(function(){
        event.preventDefault();
        $(".averageloc").slideToggle("slow");
    });
    $(".showavgvis").click(function(){
        event.preventDefault();
        $(".averagevis").slideToggle("slow");
    });
</script>
<?php
foreach ($teams as $team) { 
    if ($page=="game") { 
        if ($team==$locteam) { 
            echo "<button class='showavgloc'>Show average player</button>";
        }
        if ($team==$visteam) {
            echo "<button class='showavgvis'>Show average player</button>";
        } 
    }   
    if ($team==$locteam) {
        echo "<div class='averageloc' style='display:none'>This div has to be shown/hidden for local team</div>";
    }   
    if ($team==$visteam) {
        echo "<div class='averagevis' style='display:none'>This div has to be shown/hidden for road team</div>";
    }   
}
?>

Answer 1

尝试这样做：

在那个PHP代码之后，在关闭它之前（在这个“？＆gt;”之前），做一个包含以下内容的“echo”：

<script>
    $(".showavgloc").click(function(){
        event.preventDefault();
        $(".averageloc").slideToggle("slow");
    });
    $(".showavgvis").click(function(){
        event.preventDefault();
        $(".averagevis").slideToggle("slow");
    });
</script>

并尝试根据需要使用它。在某些情况下这可能会有所帮助，因为当您使用jQuery库然后生成html throw代码时，DOM会保留“初始”版本，jQuery无法正常工作，因为从未找到控件。正确的顺序是：打印控件然后绑定jQuery事件。

祝你好运

Answer 2

当包含所有内容时，您的代码似乎工作正常：

$(".showavgloc").click(function(){
  event.preventDefault();
  $(".averageloc").slideToggle("slow");
});
$(".showavgvis").click(function(){
  event.preventDefault();
  $(".averagevis").slideToggle("slow");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<button class='showavgloc'>Show average player</button>
<button class='showavgvis'>Show average player</button>
<div class='averageloc' style='display:none'>This div has to be shown/hidden for local team</div>
<div class='averagevis' style='display:none'>This div has to be shown/hidden for road team</div>

我的猜测是其他东西不对劲。检查您的页面以确保PHP正确打印所有元素。如果一切看起来都很好，你可以尝试使用jQuery“on”函数，该函数应该监视与选择器匹配的新元素。 https://api.jquery.com/on/

在循环内切换脚本仅适用于第一次迭代

2 个答案: