添加查看更多按钮

我有引导的SQLserver和PHP创建此节...添加查看更多按钮

有什么办法只显示一个小的，并给了查看更多按钮选项来显示整个结果？

有像10层甲板，我想e.g到sidplay只有2，当用户点击查看更多显示所有的人。

这是我的PHP代码的结果。

<div class="vertical-wrapper"> 
<?php 
for($i=0;$i<count($decks);$i++){ 
    $deck_name = $decks[$i]['name']; 
    $deck_desc = $decks[$i]['description'];           
    $deck_img_link = $json['deckplans'][$i]['images'][0]['href']; 
    echo "<img class='bd-imagelink-157 bd-own-margins bd-imagestyles' src='$deck_img_link'><p class='bd-textblock-779 bd-content-element'>$deck_name</p>"; 
    echo $deck_desc; 
} 
?> 
</div>

我试图把引导添加更多按钮，但显示在节结束，所有的内容都加载之后，是毫无意义的

来源

2017-09-05 Maria

你为什么要使用一个for循环，而不是一个foreach循环？你的循环开始可以很容易地定义为'foreach（$ decks as $ deck）'，然后你可以调用例如'$ deck_name'将会是'$ deck ['name']''。 – GrumpyCrouton

您是否想要动态请求并加载每个套牌的更多内容，或者当单击“查看更多”时只显示前端的所有套牌？ –

@SebCooper我真的不介意..我也不能管理。只是想使它工作..但可能请求是更困难的ajax，我不知道ajax，只是一点点的JavaScript – Maria

下面的示例演示如何您可能看到其他隐藏的物品一次一个。您需要使用jQuery JavaScript库才能正常工作。

$('#viewmore').on('click', function(){ 
 
\t $('.item:hidden').show(); 
 
})

.hidden { 
 
    display: none; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="item"> 
 
ITEM 1 
 
</div> 
 
<div class="item hidden"> 
 
ITEM 2 
 
</div> 
 
<div class="item hidden"> 
 
ITEM 3 
 
</div> 
 
<div class="item hidden"> 
 
ITEM 4 
 
</div> 
 
<button id="viewmore"> 
 
View More 
 
</button> 
 
</button>

来源

2017-09-05 13:22:42

是否有可能显示所有项目时点击查看更多，而不是一个一个地显示？ – Maria

是的，只需从事件处理程序选择器中移除'.first（）'方法即可。 [更新了答案以反映这一点。] –

添加查看更多按钮

回答

相关问题