Question

我想让复制按钮复制用户的值，但问题是该按钮只复制了第一个用户的值。当移动到第二个用户时，它仍然复制第一个用户的值。这是我的代码。

<?php
    require_once('connection.php');
    $sql = "SELECT ftname, menu, longlan FROM 
    ownerinfo";
    $result = $con->query($sql);

    if ($result) {
        // output data of each row
        while($row = $result->fetch_assoc()) {
            $a=1;
            $long[$a]=$row["longlan"];

            echo "Food Truck: " . $row["ftname"]. " 
            <br>Menu: " . $row["menu"].  " 
            <br>Longitude Latitude: <input id='he ' 
            value='".$long[$a]."'></input><button 
            onclick='myFunction()'>Copy</button><br>
                                <a 
            href='https://maps.google.com/'>Maps</a> 
            <hr>";

            $a=$a+1;
        }          
    } else {
        echo "0 results";
    } 
?>

<script>
  function myFunction() {
  var copyText = document.getElementById("he");
  copyText.select();
  document.execCommand("copy");
  alert("Copied the text: " + copyText.value);
  }

Answer 1

考虑到您的循环输出ID，您的JavaScript只能 target the first instance of that ID （因为多个ID被视为 invalid markup ）。

要更正此问题，请改为从PHP输出类：

<input class='he' value='".$long[$a]."'>

循环遍历JavaScript中的每个类：

const copyText = document.getElementsByClassName("he");
for (let i = 0; i < copyText.length; i++) {
  copyText[i].select();
  document.execCommand("copy");
  alert("Copied the text: " + copyText[i].value);
}

复制按钮不读取第二个值

1 个答案: