使用jquery mobile和模型构建动态网格

Question

我尝试使用php和jquery mobile构建动态网格。我想知道是否有人可以帮助我使用模数来确定ui-block是否需要是a-d，具体取决于迭代的关键值。

<div class="ui-grid-c"> 
     @forelse($photos as $key=>$photo) 

      @if($key == 1) 
       <div class="ui-block-a">         
        <img src="{{ $photo['file'] }}" width="60" /> 
       </div> 
      @elseif($key == 2) 
       <div class="ui-block-b">         
        <img src="{{ $photo['file'] }}" width="60" /> 
       </div> 
      @elseif($key == 3) 
       <div class="ui-block-c">         
        <img src="{{ $photo['file'] }}" width="60" /> 
       </div> 
      @elseif($key == 4) 
       <div class="ui-block-d">         
        <img src="{{ $photo['file'] }}" width="60" /> 
       </div> 
      @endif 

     @empty 

      Nothing Found 

     @endforelse 
    </div> 

我已经尝试了几种不同的模数变化，但没有任何工作正确。任何帮助，将不胜感激。

Answer 1

你想修改你的ui-grid-c类，以便根据列数动态变化。

• UI栅-a = 2分的列
• UI栅-B = 3列
• UI栅-C = 4列
• 等。

为您的列..

• UI - 嵌段 - 一个 - 是您的第一列
• UI-嵌段b - 是你的第二式柱
• 等。

因此，您需要跟踪您在列中添加的次数，然后添加字母表字母。

使用会为您提供字符a，然后在添加列时为其他字符增加86。