Question

我正在显示在线用户。当我单击其中一个用户时，相应的用户应显示在下面的文本框中。我正在使用javascript，但它只采用第一个用户。当我单击第二个用户时，第一个用户显示在下面的文本框中。为什么只采用第一个阵列？

<?php
    foreach($query as $row)
    {
    ?>
        <input type="text" name="user" id="user" value="<?php echo $row->users;?> onclick="select_online()">
<?php
    }
    ?>
    <script>

    function select_online()
    {
        var user=document.getElementById("user").value;
        document.getElementById("usersonline").value=user;
    }
    </script>


Name:<input type="text" name="usersonline" id="usersonline">

Answer 1

首先，对许多元素使用相同的id是一个错误。您应该为生成的输入创建不同的id属性。

其次，您应该使用this来获取当前元素的值：

function select_online()
{
    var user=this.value;
    document.getElementById("usersonline").value=user;
}

document.getElementById("user")语句将始终选择id属性等于“user”的元素，它将始终相同。最有可能的是，这不是你想要的。如果我理解正确，你想得到被点击元素的value，正如我之前提到的，你可以使用this表达式来实现它，它指向当前被点击的元素。

Answer 2

您应该为输入指定一个唯一的名称。您不能多次重复使用id =“user”，否则javascript将无法找到每个输入元素。

以下情况会更好：

<?php
    $id = 0;
    foreach($query as $row) {
        $id += 1;
?>
<input type="text" name="user" id="user-<?php echo "$i"; ?>" value="<?php echo $row->users;?> onclick="select_online(<?php echo "$i"; ?>)">
<?php
    }
?>

<script>
    // Move script outside loop
    function select_online(i) {
        var user = document.getElementById("user-" + i).value;
        document.getElementById("usersonline").value = user;
    }
</script>

Name:<input type="text" name="usersonline"id="usersonline">

Answer 3

根据HTML标准，文档中应该有唯一的ID。但在您的情况下，您使用id = user生成多个输入标记。 Javascript＆＃39; document.getElementById只能使用id = user获取元素。

为此你可以改变你的代码：

<?php foreach($query as $row) {  ?>
    <input type="text"   name="user"  id="user"   value="<?php echo $row->users;?>" onclick="select_online(this)">
<?php } ?>
<script> 
function select_online(elm) {
    var user=elm.value;
    document.getElementById("usersonline").value=user;
}
</script>
Name:<input type="text" name="usersonline"id="usersonline">

在这里点击，我们传递输入标签的refferance。所以我们可以获得点击输入的refferance。

Answer 4

 <input type="text" name="user" id="user" value="<?php echo $row->users;?> onclick="select_online()">

您正在为所有用户设置id作为用户，因此当您使用selector document.getElementById（“user”）时，它始终会获取第一行。

永远不要对多个元素使用相同的ID。它总是会导致错误。

循环中的javascript函数无法正常工作

4 个答案: