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>";

Followed this to make the javascript part.

$(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，则可以使用类。为每个输入添加一个唯一的类。例如，＆＃34; r1c1＆＃34;对于第1行第1列，依此类推。那么你可以

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

输入press后，将焦点设置在动态创建的输入字段上

1 个答案: