jQuery:从div元素获取值将它们附加到输入以提交

时间:2015-10-14 16:09:49

标签: javascript jquery

感谢阅读,我一直在寻找示例或教程,但我认为我没有正确的Google术语来查找有关此问题的教程。

我喜欢做什么;我想知道如何将多个产品标题从简单的购物车系统/脚本附加到用于提交的输入值。

下面是我的HTML表单元素中的HTML标记,还有一些其他输入和文本字段,如电话,电子邮件和类似的东西,但这些字段已经正常工作。我需要知道的是如何在div元素中获取这些产品名称并将它们附加到底部隐藏输入标记的空值标记中,以便我可以使用我的电子邮件脚本提交它们?

<div class="simpleCart_items">
  <ul>
    <li class="itemRow row-0 odd" id="cartItem_dv-7">
      <div class="item-name">Product name 1</div>
    </li>
    <li class="itemRow row-1 even" id="cartItem_dv-3">
      <div class="item-name">Product name 2</div>
    </li>
    <li class="itemRow row-2 odd" id="cartItem_dv-11">
      <div class="item-name">Product name 3</div>
    </li>
  </ul>
</div>


<div class="hide">
  <input class="hide" type="hidden" name="multi_products" value="** product names here **">
</div>

编辑添加了这个,将代码包装成一个表单.submit function / event。但这不起作用..

$( "form" ).submit(function( event ) {

    var itemArray = $(".item-name").map(function() { return $(this).text() }).get(),

    commaSeparatedItems = itemArray.join(",");

    $('input[name=multi_products]').val(commaSeparatedItems)

});

1 个答案:

答案 0 :(得分:1)

你可以得到一个很好的数组,然后用逗号加入它们:

var itemArray = $(".item-name").map(function() { return $(this).text() }).get(),
//["Product name 1", "Product name 2", "Product name 3"];
    commaSeparatedItems = itemArray.join(",");
//"Product name 1,Product name 2,Product name 3"