jQuery的 - 从PHP foreach循环

存储变量我只是有一个发挥作用的，努力增强我的jQuery的知识，我碰到的一个问题，我不能绕到我的头。我正在使用laravel，只是作为一个附注，但这也适用于标准PHP。jQuery的 - 从PHP foreach循环

我本质上检索数据的集合，我想用jQuery操纵。检索的列表大小会不断变化;例如：

有一些对象的集合。
每个对象具有一定量的连接到它的产品。
每个项目都有一个名称和数量。
检索时我希望能够显示每个项目的名称和数量。
如果我然后改变金额。我希望每个项目的数量都相应改变。

这里是我的代码：

@foreach($items as $item) 
<li><span class="item_amount">{{ $item->amount }}</span>{{ $item->name }}</li> 
@endforeach

这检索关联到这个对象中的所有物品：我们看到像在这种情况下：

400条1/1
67 ITEM2
830项目3

我有一个非常简单的HTML <select>输入：

<select id="steven" class="formDropdown"> 
    <option>Select item amount</option> 
    <option value="1">1</option> 
    <option value="2">2</option> 
    <option value="3">3</option> 
</select>

那么，什么我想要做的是检索每个项目的数额，将其存储在jQuery的一个变量，然后当<select>量改变，项目数量将乘以它。

例如，如果2从选择输入选择的列表将变为：

800条1/1
134 ITEM2
1660项目3

我已经想通了，检索金额的最佳方法是将该变量设置为PHP。

var originalAmount = '{{ $item->amount }}';

我之所以做这种方式是因为如果我选择<span>标签内的HTML的值，每次我乘一次乘上显示的金额，而不是原来的量。一个例子：

如果量为10和我乘以3的结果是30，如果II然后乘以2，期望20（10 * 2）I明显现在得到60.

不是我想要的。

正如你可以在这里看到我的问题是，我需要为每个项目的变量在我的foreach循环，在那里我试着做这样的事情：

$(".item_amount").each(function(index) { 
    alert(amount+ ": " + $(this).text()); 
});

它提醒我每个订单的金额，一切都很好，但我现在想要存储这些金额作为一个变量，它对应于它在列表中的位置：

我试图做这样的事情来获得一个动态变量名称：

@foreach($items as $item) 
<li><span class="item_amount{{$item->amount}}">{{ $item->amount }}</span>{{ $item->name }}</li> 
@endforeach

这会给我一个动态类，然后我可以选择和操作哪一个是完美的。

但是，如何将这些作为一个变量存储在jQuery中？

变量1将被命名为 “item_amount400” 具有400
变量2值将被命名为 “item_amount67” 与67
变量3值将被命名为 “item_amount830” 与830

，我想实现这样做，我上面提到的内容：

var item_amount400 = '{{ $item->amount }}';

我可能这样做是最重要的，也是最重要的。

是否可以在foreach循环内创建变量，然后在循环外部检索所有变量？例如。像这样：

@foreach($items as $item) 
<li><span class="item_amount{{$item->amount}}">{{ $item->amount }}</span>{{ $item->name }}</li> 
<script> 
    make variable here 
</script> 
@endforeach

如果是这样，我怎么会去这样做，我怎样才能使变量全球和知道检索到底是什么？

就像我提到的每个对象都有不同数量的物品，有些人可能有3部分可有30

来源

2017-10-17 Colin Barstow

你真的需要的量添加到类名？ –

我不知道，这就是为什么我问。这是一个可能的解决方案，我不知道如何解决这个问题。 –

我会从类名中删除金额。并在您的选择框中添加一个Jquery onchange。在该函数中，选择所有具有类名称为“item_amount”的元素，并将该值设置为当前值*选定值。 –

请在下面找到使用数据片段属性 - 由@jcaron提到的 - ，它会使用原来的由PHP生成的值：

@foreach($items as $item) 
<li><span class="item_amount" data-amount="{{ $item->amount }}">{{ $item->amount }}</span>{{ $item->name }}</li> 
@endforeach

$('.formDropdown').bind('change', function(e){ 
 
var multiply = $(this).val(); 
 
    $(".item_amount").each(function(index, item) { 
 
     $(item).text(multiply*($(item).data('amount'))); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul> 
 
<li><span class="item_amount" data-amount="800">800</span> item1</li> 
 
<li><span class="item_amount" data-amount="134">134</span> item2</li> 
 
<li><span class="item_amount" data-amount="1660">1660</span> item3</li> 
 
</ul> 
 

 
<select id="steven" class="formDropdown"> 
 
    <option>Select item amount</option> 
 
    <option value="1">1</option> 
 
    <option value="2">2</option> 
 
    <option value="3">3</option> 
 
</select>

来源

2017-10-17 12:26:15

完美的作品，非常感谢你！ –

下面的代码会做的东西，在selrect箱量它的变化将与列表项的数目乘以

<select id="steven" class="formDropdown"> 
    <option>Select item amount</option> 
    <option value="1">1</option> 
    <option value="2">2</option> 
    <option value="3">3</option> 
</select> 

<br><br><br> 
<div class="content"> 
    @foreach($items as $item) 
     <li><span class="item_amount">{{ $item->amount }}</span>{{ $item->name }}</li> 
    @endforeach 
</div> 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
<script type="text/javascript"> 
    $(document).on('change', '.formDropdown', function() { 
     var amount = $(this).val(); 
     updateUI(amount); 
    }); 
    function updateUI(amount){ 
     $(".item_amount").each(function(index) { 
      var value = parseInt($(this).text()); 
      $(this).text(amount * value); 
     }); 
    } 
</script>

希望这有助于

来源

2017-10-17 12:29:00

jQuery的 - 从PHP foreach循环

回答

相关问题