如何在 php 循环中单击按钮时显示隐藏框中的值

Question

我试图建立商店简单的学习网站，但当我单击按钮时我陷入困境。当我点击它时什么也没有发生。当我单击按钮时，它应该显示隐藏按钮上值的文本。

下面是我的 php 代码，

$i=1;
                         while($rows = mysqli_fetch_assoc($varresultP)){
                           echo "<button type='button' class='btn btn-outline-primary' onclick='myFunction()' >".$rows['var_name']."</button>";
                           echo "<input type='hidden'  name='price' value=".$rows['price']." id='price{$i}'>";
                           echo "<input type='hidden' value=".$rows['id']." id='id{$i}'>";
                           echo "<input type='hidden' value=".$rows['quantity']." id='quantity{$i}'>";
                            
                            $i++;
                         }

结果是出现多个按钮，但当我单击按钮时没有任何反应。总计按钮基于数据库中有多少数据。

下面是

function myFunction() {
  for(var i=1; i<5; i++){
  var x = document.getElementById("price"+i).value;
  document.getElementById("sendPrice").innerHTML = x;

  var x = document.getElementById("id"+i).value;
  document.getElementById("idDiv").innerHTML = x;

  var x = document.getElementById("quantity"+i).value;
  document.getElementById("showQuantity").innerHTML = x;
  }
}

我想要在 div id(sendPrice) 上显示的来自 id(price) 的 jsquery 值，以及来自 id(id) 的值需要在 href 按钮中显示，来自 id(quantity) 的值，当按钮单击时，我需要它将显示在 div id(showQuantity) 上。

下面是html代码

    <div class ='row' style='padding: 30px; width: 100px;'><p>USD: <label class='p2--semi-bold c-red' id='sendPrice'></p></label></div>
<div class ='row' style='padding: 30px; width: 100px;'><p>Productid: <label id='idDiv'></p></label></div>
<div class ='row' style='padding: 30px; width: 100px;'><p>Quantity: <label id='showQuantity'></p></label></div>

Answer 1

首先将 {$i} 添加到您的 onclick='myFunction()' 中，如 onclick='myFunction({$i})'

第二个您的 JavaScript 删除了 for 循环并将 i 添加到 function myFunction() { 就像 function myFunction(i) {

Demo

function myFunction(i) {
  var x = document.getElementById("price" + i).value;
  document.getElementById("sendPrice").innerHTML = x;

  var x = document.getElementById("id" + i).value;
  document.getElementById("idDiv").innerHTML = x;

  var x = document.getElementById("quantity" + i).value;
  document.getElementById("showQuantity").innerHTML = x;
}

<button type='button' class='btn btn-outline-primary' onclick='myFunction(1)'>".$rows['var_name']."</button>
<input type='hidden' name='price' value=".$rows['price']. ROW1" id='price1'>
<input type='hidden' value=".$rows['id']. ROW1" id='id1'>
<input type='hidden' value=".$rows['quantity']. ROW1" id='quantity1'>";

<button type='button' class='btn btn-outline-primary' onclick='myFunction(2)'>".$rows['var_name']."</button>
<input type='hidden' name='price' value=".$rows['price']. ROW2" id='price2'>
<input type='hidden' value=".$rows['id']. ROW2" id='id2'>
<input type='hidden' value=".$rows['quantity']. ROW2" id='quantity2'>";



<div id="sendPrice"></div>
<div id="idDiv"></div>
<div id="showQuantity"></div>