javascript - Foreach 循环仅从数据库中回显一行

Question

这就是我的代码所做的:当在 #type 输入字段中键入用户名时，如果键入的值与我的数据库表 users 中的行值匹配，然后我的 jquery 代码就会开始工作。然后，我的 jquery 代码将显示隐藏的 div，其中包含用户名中键入的文本。我的问题是我当前的代码忽略了其他输入的用户名，并且出于某种原因只会显示一个用户名。我的问题示例:

 allen   <-- "allen" is typed in input field
--------
[allen]  <-- hidden div for allen now shows

 pete
-------- <-- "pete" is typed in input field
         <-- but hidden div for pete does not show. Why?

这是我的js代码的事件冒泡问题吗？因为我确实添加了 e.propagation 但它什么也没做。我将如何重写我当前的代码，以便键入的任何用户名 将显示一个隐藏的 div。因为目前我只能为“allen”获取隐藏的 div，而不能为其余用户名获取。请帮忙，这是我的代码:

<input id="type">
<?php foreach (array_combine($userids, $usernames) as $userid => $username): ?>
<div id="border<?php echo $userid; ?>" style="display: none;">
    <input id="username<?php echo $userid; ?>" value="<?php echo $username; ?>" type="radio">
    <label for="username<?php echo $userid; ?>"><?php echo $username; ?></label>
</div>  
<?php endforeach; ?>

$("#type").on('input',function(){
    var userid = '<?php echo $userid; ?>';
    if (this.value == $("#username"+userid).attr('value')) {    
        $("#border"+userid).css("display", "block");
    }
    else {
        $("#border"+userid).css("display", "none");
    }
});

SQL代码:

$stmt = $conn->prepare("SELECT userid, username FROM usern");
$stmt->execute();
$result = $stmt->get_result();
while($row = $result->fetch_assoc()) {
  $userids[] = $row['userid'];
  $usernames[] = $row['username'];
}
$stmt->close();

@MohammadBagheri - 以下代码的输出:

$stmt = $conn->prepare("SELECT userid, username FROM usern");
$stmt->execute();
$result = $stmt->get_result();
while($row = $result->fetch_assoc()) {
    echo '<pre>'.print_r($row, 1).'</pre>';
}
$stmt->close();

输出:

Array
(
    [userid] => 35
    [username] => pete
)

Array
(
    [userid] => 44
    [username] => allen
)

Answer 1

我知道问题出在哪里。

<input id="type">
<?php foreach (array_combine($userids, $usernames) as $userid => $username): ?>
<div id="border<?php echo $userid; ?>" style="display: none;">
    <input id="username<?php echo $userid; ?>" value="<?php echo $username; ?>" type="radio">
    <label for="username<?php echo $userid; ?>"><?php echo $username; ?></label>
</div>  
<?php endforeach; ?>

$("#type").on('input',function(){
    var username = $(this).val();
    var userid = $("input[value='"+username+"']").attr("id");

    $("div[id^=border]").css("display", "none");
    $("#border"+userid).css("display", "block");
});

您一直在选择循环最后一次出现的用户 ID 并在 jquery 代码中设置它，这意味着它将始终显示具有该用户 ID 的用户，而不检查您输入的内容。

如果您需要更多帮助，请告诉我。