使用循环中动态创建的 jquery 从表单中获取选择选项值

Posted 2023-05-09

【中文标题】使用循环中动态创建的 jquery 从表单中获取选择选项值

【英文标题】：Get select option value from forms using jquery created dynamically in loop

【发布时间】：2017-04-13 11:12:06

【问题描述】：

这是我在这里的第一个问题，如果我违反了任何规则，请原谅我。更具体地说，这是一个与 jquery 相关的问题，我对 jquery 的了解是有限的。

我试图从 FOR 循环中动态创建的表单中获取 SELECT 元素的值。问题是虽然我能够获取第一个表单的值，但它为下一组表单返回相同的值。

例如，使用 FOR 循环，我生成了 5 个动态表单，其中包含多个隐藏输入字段、一个选择字段（值是静态的，例如 1、2、3 等）和一个提交按钮。使用 jquery attr() 函数获取不同表单的隐藏输入字段的值没有问题。但是当我将此 attr() 函数应用于 SELECT 字段时，它仅适用于第一种形式。所有后续表单都返回与第一个表单相同的值。

var value= $('option:selected', '.select-class').attr('data-value');

请建议我如何获取循环内多个表单的 SELECT 字段的值。

谢谢

编辑：下面我粘贴了整个代码。它已从原始版本进行了修改，但问题仍然相同。您现在可以看到我正在使用锚标记（而不是按钮）和 while 循环（现在而不是 for 循环）发送数据。请看一下代码。

<?php while($fetch=$query->fetch())  ?>
      <select class="form-control sel_qty" name="product_qty" >                                            
             <option value="1" data-qty="1">1</option>
             <option value="2" data-qty="2">2</option>
             <option value="3" data-qty="3">3</option>
             <option value="4" data-qty="4">4</option>
             <option value="5" data-qty="5">5</option>                                            
       </select>
       <a href='#' class="btn btn-primary cart_submit" 
            data-code="<?php echo $fetch['product_code']; ?>" 
            data-title="<?php echo $fetch['title']; ?>" 
            data-price="<?php echo $fetch['price']; ?>" 
            data-url="<?php echo $fetch['url']; ?>" > 
        Submit 
        </a>
<?php  ?>

使用 jquery，我可以通过以下方式获取 while 循环中每个锚标记的数据属性值：

                   var product_code= $(this).attr("data-code");
                   var product_title= $(this).attr("data-title");
                   var product_price= $(this).attr("data-price");
                   var product_url= $(this).attr("data-url");

但是如何在 while 循环中获取每个选择元素的值。我只能获得第一个选择元素的价值，而不能获得后续选择元素的价值。

                 var value= $('option:selected', '.sel_qty').attr('data-qty');

上面的代码只获取循环中可用的第一个选择元素的值

【问题讨论】：

您需要再次循环以获取所有选项值。表单上的 For 循环。

能不能出示一下代码（完整）

【参考方案1】：

根据您提供的少量信息和代码，如果您发布的代码是循环内的代码，那么您的问题不是动态创建的表单，而是您使用的循环内的引用不是相对的。 在不知道自己在做什么的情况下，您可以执行以下操作：

$('form').each(function()
    var form = $(this);
    var value= form.find('option:selected', '.select-class').attr('data-value');
    ...
)