基于剃刀循环在jquery中循环

时间:2015-02-10 06:19:54

标签: javascript jquery asp.net-mvc asp.net-mvc-4 razor

我的剃须刀视图中的每个循环都有一个(MVC4)

 @foreach (var fe in ViewBag.FeatureProducts)
  {

    <div class="product-details" style="display:none;">@Html.Raw(fe.Details)</div>
    <div class="product-qty-dt">   </div>

  }      

在每个循环中我必须提取@html行内容并显示到div'product-qty-dt'。

为此,我编写了以下jquery,

$(document).ready(function () {        
       var data = $('.product-details p').map(function () {
           return $(this).text();
       }).get();           
       //product availability
       var availability = data[2].split(",");        
       $.each(availability, function (i) {
           $('.product-qty-dt').append( availability[i])
       });

   });

但这只是考虑到最后一次生态。如何在每次循环调用中调用此jquery。

例如,在第一个循环中,

  <div class="product-details" style="display:none;"><p>Lorem, Ispum</p><p>doler emit,fghjh</p><p>9gm</p></div>
  <div class="product-qty-dt"> 9gm  </div>

第二个循环

 <div class="product-details" style="display:none;"><p>Lorem, Ispum</p><p>doler emit,fghjh</p><p>5gm</p></div>
 <div class="product-qty-dt"> 5gm  </div>

Thirdloop

 <div class="product-details" style="display:none;"><p>Lorem, Ispum</p><p>doler emit,fghjh</p><p>3gm</p></div>
 <div class="product-qty-dt"> 3gm  </div>

2 个答案:

答案 0 :(得分:1)

以下内容会将<p>元素中最后一个<div class="product-details">的文本添加到相应的<div class="product-qty-dt">元素中

$('.product-details').each(function () {
  var t = $(this).children('p').last().text();
  $(this).next('.product-qty-dt').text(t);
}) 

答案 1 :(得分:1)

这应该可以解决问题。此外,仅在您希望访问存储在产品详细信息中的其他数据部分时仍使用data数组。

$(".product-details").each(function()
    {
        var data = $(this).find('p').map(function () { return $(this).text() }).get();
        $(this).next('.product-qty-dt').text(data[2]);
    })