Javascript 提交多个动态表单

我试图在单击一个按钮时同时提交多个表单。这些表单都是自动生成的。它们都有不同的操作URL，但id相同。这就是系统（SaaS）的工作方式

问题是我在获取正确的selectbox值然后发送表单时遇到问题。我没有收到任何错误，但我认为这与标识符有关。我在做这件事已经有几天了，我想不出这件事

因此，对于每个集合/产品，都有一些空html，如下所示：

HTML

---

有没有人知道出了什么问题，或者给我一些如何解决的指导？

尝试使用

$（'form[name=“formsub”]：visible'）

作为选择器。这应该只提供可见的表单，而不是页面上的所有表单。

我在该示例链接中没有看到任何表单，单击图像只会将我带到该产品的页面，而不提交任何表单。@Claytoleis:是的，对不起。。。更正了链接！逐步完成脚本并检查表单数据是否正确生成。我已从这个问题中删除了一段与实时描述和链接相关的文本，用户可以在您提问时尝试使用这些文本。由于您可能在收到答案后不久就解决了问题，因此该链接/材料对未来的读者没有帮助。对于进一步的问题，如果您可以尝试将描述保留在问题中，也可以选择使用JS Fiddle之类的粘贴板，这将有助于让问题插图为未来的读者服务。谢谢好的，这似乎有效…谢谢！仍然是个问题的问题。。。当触发按钮时，只有第一个产品添加到购物车。这是因为相同的

变体使用了两次。如何获取所有表单的所有
变体
<代码>每个

都不起作用。。！

<div id="sets" class="clearfix">

 // first set
  <div class="set" data-handle="url" >
    <div class="right">
      <div class="products">
        <div class="close"></div>
        <div class="product">
          /// in here comes the product data from json ///
        </div>
        <div class="set-bestellen">
          <div class="link">
            <a title="add" class="trigger"><span>add to cart</span></a>
          </div>
        </div>
      </div><!-- .products -->
    </div><!-- .right -->
    <div class="image"></div>
  </div>

 // second set
  <div class="set" data-handle="url" >
    <div class="right">
      <div class="products">
        <div class="close"></div>
        <div class="product">
          /// in here comes the product data from json ///
        </div>
        <div class="set-bestellen">
          <div class="link">
            <a title="add" class="trigger"><span>add to cart</span></a>
          </div>
        </div>
      </div><!-- .products -->
    </div><!-- .right -->
    <div class="image"></div>
  </div>
// etc... can be as much as 10 sets

</div><!-- .#sets -->

 $('#sets .set').each( function(){

    $(this).click(function(){

      if($(this).hasClass('open')){

        $('.close').click(function(){
          $('#sets .product').fadeOut();

          $('.products',this).animate({
            width: 'toggle'},500, function() {
             .......
            });
        });
      } else {

        .....

        }

        var url = $(this).data('handle')+'?format=json';

        $.getJSON(url, function (data){

          var product = data.product;

          var $container = $('.products .product');
          var productsHtml = [];

          var fullurl = 'http://www.shop.com';
          var variants = '';
          $.each(product.related, function(index, rel){
            var url = ''+fullurl+''+rel.url+'?format=json';

            ...... etc ...
            var productHtml = '<div id="'+rel.id+'" class="p"><form method="post" id="product_configure_form" action="http://www.shop.com/cart/add/'+rel.vid+'/" name="formsub"><div class="foto"><a href="'+fullurl+''+rel.url+'"><img class="rollover" src="'+image+'" hover="'+image2+'" alt="'+rel.fulltitle+'"/></a></div><div class="prijs" data-price="'+rel.price.price_incl+'">€'+rel.price.price_incl+'</div><div class="varianten_'+rel.id+'">';


            $.getJSON(url, function (data){
              var rel = data.product;

              var wqsSelectVariants = $('<div class="product-configure-variants tui" />');
              var select = $('<select id="product_configure_variants"/>');

              $.each(rel.variants, function (index, variant){
                select.append('<option value=' + variant.id + '>' + variant.title + '</option>');
                wqsSelectVariants.append(select);
              });
              $('.varianten_'+rel.id).html(wqsSelectVariants);
            });

            var price = rel.price.price_incl;
            sum += price;

            productHtml = productHtml + '</div></form></div>';
            productsHtml.push(productHtml);
          });
          $('.total').text('€'+sum.toFixed(2));
          productsHtml = productsHtml.join('')
          $container.html(productsHtml);
        });

      }      
    });

  });  

  etc.... 


<script type="text/javascript">
  $(document).ready(function(){

    $(".trigger").on("click", function(e){
      e.preventDefault();

      $('form[name="formsub"]').each(function(){
        var variant = $('#product_configure_variants').val();

        var $form = $(this);

        $.ajax({
          type: $form.attr('method'),
          url: $form.attr('action')+variant+'/?quantity=1',
          data: $form.serialize(),
          success: function(data, status){
            if(status == 'success'){

            }else if(status == 'error'){

            }
          }
        });
      });


    });

  });
</script>