我想使用jquery获取foreach循环中的输入字段值。下面是html结构
@foreach ($products as $product)
<div class = "form-row">
<input type="text" name="quantity" class="form-control quantity"value="{{$product->quantity }}">
<input type="text" name="price" class="form-control price"value="{{$product->price}}">
</div>
@endforeach
我试图通过这种方式获得价值
var quantity = $('.quantity').val();
var price= $('.price').val();
但这样，我只得到第一行的值。如何使用jQuery获取所有行的值？
您必须遍历所有元素以从中获取值。
您可以尝试jQuery的.map()和.get()来获取数组中的所有值。
演示：
null
var quantityArr = $('.quantity').map(function(){
return +this.value;
}).get();
console.log(quantityArr);
// if you want the value comma separated then join the array
var quantityCommaSeperatedString = quantityArr.join(',');
console.log(quantityCommaSeperatedString);
var priceArr = $('.price').map(function(){
return +this.value;
}).get();
console.log(priceArr);
// if you want the value comma separated then join the array
var priceCommaSeperatedString = priceArr.join(',');
console.log(priceCommaSeperatedString);<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" name="quantity" class="form-control quantity"value="1">
<input type="text" name="price" class="form-control price"value="10">
<input type="text" name="quantity" class="form-control quantity"value="2">
<input type="text" name="price" class="form-control price"value="20">
<input type="text" name="quantity" class="form-control quantity"value="3">
<input type="text" name="price" class="form-control price"value="30">