Question

我目前在jQuery和PHP上有问题。

当我尝试从生成的php代码中点击类“ .id_annonce”时，它没有抓住我单击的确切值，而是另一个，并且始终固定，输入隐藏值为18，应为19或20

jQuery代码：

var commander = $(this).val();
  var beta = $('body .id_annonce').val();
  window.location.href = 'panier.php?id='+ commander +'?annonce='+ beta + '';

我的php代码：

require 'produits.php';
$pro = new produits;
$coll = $pro->getAllproduits();
foreach ($coll as $key => $value) {

    echo '<div class="card-body  my-3 border-top" >
        <img src="img/resize.jpg" class="card-img-top  " style="height:88px;width:88px;margin-left:20px;float:right;" alt="...">   
        <h3 class="card-title p-2" style="font-size:10px;font-style:none;font-weight:600;"><strong>Ajouté Le : </strong> ' . $value['date_ajout'] . '</h3>
        <div class="d-flex flex-row">
        <h6 class="card-subtitle p-2  mb-2  text-muted"><strong>Varieté : </strong>' . $value["variete"] . '</h6>
        <h6 class="card-subtitle p-2 mb-2  text-muted" style="font-style:none;"><strong>Especes :  </strong>5000 tonnes</h6></div>
        <div class="d-flex flex-row">
        <h6 class="card-subtitle p-2  text-muted"><strong>Classe : </strong>' . $value["classes"] . '</h6>
        <h6 class="card-subtitle p-2  text-muted" style="font-style:none;"><strong> Quantité :  </strong>' . $value["quantite"] . '</h6></div>
        <h6 class="card-subtitle p-2 mb-2 mt-1 text-muted" style="font-style:none;float:right;font-size:24px;">    <strong>Prix : </strong> ' . $value["prix"] . 'DA/kg</h6> 
        <div class="d-flex flex-row justify-content-start" style="margin-top:50px;">
        <div class="p-1"> <button  class="details" value="' . $value["id"] . '" style="border:none;background:none;"> <i class="fa fa-info-circle fa-2x  pr-2 text-success"></i></button></div>
        <div class="p-1">
        <input type="hidden"  value="' . $value["id"] . '"  class="id_annonce">
        <button class="commander btn btn-md  btn-outline-dark " value="' . $value["id_commande"] . '"> Commander <i class="fa fa-shopping-cart  pr-2 "></i></button></div>
        <div class="p-1">  

        <button  value="' . $value["Interesser"] . '" class="interesser btn  btn-md text-dark" style="border-color:green;font-weight:600;">Interesser(' . $value["Interesser"] . ')</button></div></div></div>';

}

Answer 1

您正在按类抓取元素（并且多个元素将具有相同的类），因此您将不会获得与众不同的元素。因此，您应该在输入中添加一个特定的ID，然后便可以获取该ID。

PHP的HTML输出：

echo '<input type="hidden"  value="' . $value["id"] . '" id="annonce-' . $value["id"] . '"  class="id_annonce">'

JS：

var commander = $(this).val();
function goToAnnonce(id) {
  var beta = $('body #' + id).val();
  window.location.href = 'panier.php?id='+ commander +'?annonce='+ beta + ''; 
}

并将其绑定到按钮：

echo '<button class="commander btn btn-md  btn-outline-dark " value="' . $value["id_commande"] . '" onclick="goToAnnonce(\'annonce-' . $value["id_commande"] . '\')"> Commander <i class="fa fa-shopping-cart  pr-2 "></i></button></div>';

但是我想指出的是，这是一个过于复杂的解决方案，仅用于实现单击按钮即可更改页面。可以通过将按钮更改为链接来更简单地完成此操作：

echo '<a href="panier.php?id=' . $value["id_commande"] . '&annonce=' . $value["id"] . 
'">Click me</a>';

或通过将此单击绑定到按钮。如果要这样做，请参见this answer。

Answer 2

在按钮单击代码中，this表示已被单击的按钮。您可以使用它来导航到相关的隐藏输入。

我的首选方法是将 up 移至公共父级（$(this).closest(...），然后 down 移至所需的输入（.find("input...）当您需要多次输入，一次向上，多次向下时，这也适用。它还降低了.next（）和类似文件随附的刚性。

在您的情况下：

$(".commander").on("click", function() {
  var commander = $(this).val();
  var beta = $(this).closest(".card-body").find(".id_annonce").val();
  console.log('panier.php?id=' + commander + '?annonce=' + beta + '');
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="card-body">
  <input type="hidden" value="123" class="id_annonce">
  <button type="button" class="commander">Commander</button>
</div>

<div class="card-body">
  <input type="hidden" value="456" class="id_annonce">
  <button type="button" class="commander">Commander</button>
</div>

Answer 3

我以前误解了这个问题。你可以试试这个-

$('.commander').on('click', function(e) {
    e.preventDefault();
    const commander = $(this).val();
    const beta = $(this).siblings('.id_annonce').val();

    window.location.href = 'panier.php?id='+ commander +'?annonce='+ beta + ''; 
});

id_annonce输入字段是commander按钮的同级。因此，您可以通过获取被单击的指挥官的同级id_annonce来抓住它。

我目前在抓取从php代码生成的类值时遇到问题

3 个答案: