jquery 如何将SQLSRV结果中的每一行动态分配给< td>元素并使其可点击?

p1iqtdky  于 2023-08-04  发布在  jQuery
关注(0)|答案(1)|浏览(84)

我对JS/PHP/Web开发一般来说是非常新的,所以如果这是一个非常基本的问题,我道歉,但我试图使表中的每个<td>元素都是可点击的,并且在点击时获得<td>的文本。
现在,我有一个SQL查询,当选择日期输入时运行,并返回在所选日期发生的篮球比赛ID列。
我遇到的麻烦是,当查询填充表时,使每个单独的<td>都可单击。目前我的代码工作正常,但只有第一个<td>是可点击的。
下面是我的PHP代码,它为我提供了所选日期的游戏ID(为糟糕的格式道歉)

<table>
  <tbody>
  <tr>                
      <?php 
        while( $row = sqlsrv_fetch_array( $stmt, SQLSRV_FETCH_ASSOC) ) {
      ?>
        <td id='matchuptable' onclick="game_ids()">
            <?php echo $row['GAME_ID']?>
        </td>
      <?php
        }
      ?>
  </tr>
  </tbody>
</table>

字符串
下面是我的JS函数,当点击<td>时调用:

<script type=text/javascript src="https://code.jquery.com/jquery-3.7.0.min.js"></script>
  <script>
    function game_ids()
      {
          var gid = document.getElementById("matchuptable").innerText;
        alert(gid)
      $.post('gamelogs.php',{game_ids_name:gid},function(data){$('#gamelogs_here').html(data)})};
  </script>


我肯定有一个更干净的方法来做到这一点,任何关于格式的提示/建议都会非常感激。谢啦,谢啦

olmpazwi

olmpazwi1#

  • id* 属性应该是唯一的,我建议你添加一个计数器,并将其附加到你的基本id。你也可以在 game_ids() 函数中添加一个参数,并传递 this(表示当前点击的元素),避免DOM查找:
<tr>
    <?php
    $rowCount = 0;
    while( $row = sqlsrv_fetch_array( $stmt, SQLSRV_FETCH_ASSOC)):
        $rowCount++;
    ?>
        <td id="matchuptable-<?=$rowCount?>" onclick="game_ids(this)">
            <?php echo $row['GAME_ID']?>
        </td>
    <?php
    endwhile;
    ?>
</tr>

字符串
我使用了 while():- endWhile; 语法更好的可读性
在JS代码中,你可以将点击的元素作为一个参数:

function game_ids(el)
{
    alert(el.innerText);
    $.post('gamelogs.php',{game_ids_name:gid},function(data){$('#gamelogs_here').html(data)});
}

相关问题