按下回车后，将焦点设置在动态创建的输入字段上

Question

我只是在学习 PHP，现在我正在尝试将它与 ajax 和 javascript 结合起来。

现在我有一个表，它用通过 PHP 从 mysql 数据库中提取的数据动态填充。 除了从数据库中提取的数据外，还有三个额外的列可以输入结果（对于每个玩家行，列中有一个输入字段）。 我想要做的是在输入点击时发布数据并将焦点移动到它下面的输入字段（而不是它旁边）。

这是 PHP 部分：

echo "<table class='table table-hover table-bordered'>"; 
echo "<thead><th class='col-md-1'>Class</th><th class='col-md-1'>Number</th><th class='col-md-3'>Name</th><th class='col-md-1'>Age</th><th class='col-md-1'>Club</th><th class='col-md-1'>m1</th><th class='col-md-1'>m2</th><th class='col-md-1'>m3</th><th class='col-md-1'>Best</th></thead><tbody>";
while ($player = mysql_fetch_assoc($getGroupPlayers)){
    //Loop over players in group! 
    $ageCountry = makeAgeCountry($player['age'],$player['country']);
    echo "<tr><td>".$player['class']."</td><td>".$player['number']."</td><td>".$player['name']."</td><td>".$ageCountry."</td><td>".$player['club']."</td>
    <td class='res1'>
        <input type='name' class='form-control inputfield' id='".$player['p_id']."-res1"."' name='".$player['p_id']."-res1"."'>
    </td>
    <td class='res2'>
        <input type='name' class='form-control inputfield' id='".$player['p_id']."-res2"."' name='".$player['p_id']."-res2"."'>
    </td>
    <td class='res3'>
        <input type='name' class='form-control inputfield' id='".$player['p_id']."-res3"."' name='".$player['p_id']."-res3"."'>
    </td>
    <td>
        <div id='".$player['p_id']."-best"."'></div>
    </td></tr>";
    $counter += 1;
}
echo "</tbody></table>";

按照这个来制作javascript部分。

$(document).ready(function() {
    function sendData(elementId) {
       $.ajax({
            url: "handlelivetournament.php",
            type: "post",
            data: "msg="+$('#'+elementId).val(),
            success: function(){   
                alert($('#'+elementId).val());
            },


            error:function(){
                alert("failure");

            }
        });


    }

    $('.inputfield').keypress(function(e) {
    if(e.keyCode == 13) {
        sendData(this.id);
        switch_focus_to_row_below();
    }});
});

现在我想将焦点切换到同一列但在下一行的输入字段。 问题是我不知道元素的 id。 这样的事情可能吗？ 如果是，一旦它位于列的最后一行，它是否可以切换到下一列的第一个输入字段？

Answer 1

如果由于某种原因无法使用自定义 ID，则可以使用类。 为每个输入添加一个唯一的类。 例如，“r1c1”表示第 1 行第 1 列等。 然后你可以

1. 获取焦点输入字段的当前唯一类。
2. 将 1 添加到行部分，
3. 获取新输入并将焦点设置为它。