首页 > 解决方案 > 如何从 php 传递数据以在 javascript 中对其进行初始化?

问题描述

我正在尝试展示一些足球赛程,但我在打开 Modals 时遇到了困难。在每周的每场比赛中,我都想打开一个模式,我应该在其中显示有关相应比赛的更多信息。我需要在创建每个模态时对其进行初始化。我不知道如何将模态数据从 PHP 传递到 javascript。使用下面的代码,只有 1-5 的模态可以工作,另一个会在单击时产生错误。

PHP 模态创建

$i = 1;
$j = 1;
foreach ($games as $rounds) {
echo "<div id='et$i' class='tabcontent'>";
echo "<ul class='collection'>";

foreach ($rounds as $match) {
    echo "<li class='collection-item'>";
        echo "<div class='row'>";
        echo "<div class='center col s4'>{$match[1]}</div>";
        echo "<div class='center col s1'>-</div>";
        echo "<div class='center col s4'>{$match[0]}</div>";
        echo "<a href='#meci$j' class='secondary-content' onclick=\"$('#modal$j').modal('open');\"> <i class='material-icons'>assessment</i> </a>";
        echo "</div>";

        echo "<div id='modal$j' class='modal'>";
        echo "<div class='modal-content'>";
        echo "<div class='row'>";
        echo "<div class='center col s4'>$match[1]</div>";
        echo "<div class='center col s1'>-</div>";
        echo "<div class='center col s4'>$match[0]</div>";
        echo "</div>";

        echo "</div>";
        echo "</div>";
    echo "</li>";
    $j++;
}
echo "</ul>";
echo "</div>";
$i++;
}

Javascript 初始化

$(document).ready(function() {
    $('#modal1').modal();
    $('#modal2').modal();
    $('#modal3').modal();
    $('#modal4').modal();
    $('#modal5').modal();
});

标签: javascriptphphtmlajax

解决方案


由于您已经为所有模式提供了相同的类,因此您可以使用它来初始化它们。

$(document).ready(function() {
    $(".modal").modal();
})

推荐阅读