Question

我的html页面上有以下代码：

<input type="text" class="woocommerce-Input woocommerce-Input--text input-text" name="metin" placeholder="Geben Sie Artikel Nr" style="width: 30%;"/><br/><br/>
<input type="button" class="single_add_to_cart_button button alt" value="Suche (Advanced)" onclick="search()" /><br/><br/>
<div class="cevap" style="background-color:#e6e6e6; border: 0px solid green; padding: 2px; margin: 0px;"><i class="fa fa-spinner fa-spin fa-2x"></i></div>

和<head> ... </head>之间：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
   <script>
      function search() {
         metin = $('input[name="metin"]').val();
         $.post('/wp-content/plugins/ajax-test/SearchByNumberNew.php', {yazi: metin}, function (gelen_cevap) {
            $('.cevap').html(gelen_cevap);
         });
      }
</script>

我正在将yazi发送到SearchByNumberNew.php，经过其中的一些处理后，我会将结果发送到<div class="cevap"...

直到这里还可以。我试图在<div>的每个结果旁边放置几个按钮，以将相关值（$parcano）再次发送到SearchByNumberNew.php中。因此，我想用新值进行新搜索，并用新结果重新填充<div>（当然是在删除以前的结果之后）。

为此，我将以下代码添加到SearchByNumberNew.php的循环中：

...
?><input type="hidden" name="metin" value="<?php echo $parcano;?>"/><br/><br/>
   <input type="button" class="single_add_to_cart_button button alt" value="Suche (Basic)" onclick="searchin()" /><br/><br/>
   <?php
...

和<head> ... </head>之间的以下代码：

  function searchin() {
     metin = $('input[name="metin"]').val();
     $.post('/wp-content/plugins/ajax-test/SearchByNumberNew.php', {yazi2: metin}, function (gelen_cevap) {
        $('.cevap').html(gelen_cevap);
     });
  }

我尝试了许多变体：yazi，yazi2，metin，metin2等...，在循环之前未设置值，等等...

在我第一次在输入框中输入值的搜索中，它总是可以的。我得到了一个结果列表，每个结果行都有许多按钮。

据我在页面上的按钮代码中看到的，它们都具有正确的值。

但是当我单击其中的任何一个时，它们总是将第一个按钮的值发送到我的php文件中。

我在做什么错了？

感谢您的帮助，

关于，穆拉特

Answer 1

问题是您使用错误的标识符$('input[name="metin"]').val();将始终返回名称为metin的最后一个输入的值，尝试将每个输入组分组为一个div，而不是：

$('input[name="metin"]').val();

如果要使用输入的值，请使用此

$(this).parent().find('input[name="metin"]').val();

，如果您想使用按钮的值，则此

$(this).val();

php代码应如下所示：

...
?> 
<div>
   <input type="button" class="single_add_to_cart_button button alt" value="Suche (Basic)" onclick="searchin()" /><br/><br/>
</div>
   <?php
...

Answer 2

您是否尝试过启动jQuery块？

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script>
     (function($) {
          function search() {
            var metin = $('input[name="metin"]').val();
             $.post('/wp-content/plugins/ajax-test/SearchByNumberNew.php', {yazi: metin}, function (gelen_cevap) {
                $('.cevap').html(gelen_cevap);
             });
          }
     })( jQuery );
    </script>

Answer 3

就我所看到的代码而言，没有看到我使用button的值的地方。相反，您正在使用输入框的值。如果您使用值$（'input [name =“ metin”]'）。val（），则jquery将从页面顶部搜索输入框，并向您返回它匹配的第一个结果。因此，它将始终带来第一个结果。

有两种方法可以解决您的问题。您可以在按钮onClick事件中传递此参数，作为按钮值，您可以引用要从中获取值的输入

$('.single_add_to_cart_button').click(function(){
     metin = $('input[name="+ this.val() + "]').val();
})

第二种方法是将jquery事件绑定到按钮。

{{1}}

据我了解，你的问题。我认为这样您就可以完成任务。否则让我知道是否有任何疑问。

如何在循环结果中添加许多使用相同javascript的html按钮？

3 个答案: