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循環

回答

相關問題