我有一个网站,它显示通过PHP从MySQL表中提取的多个项目。
然后我有一个按颜色过滤(复选框显示不同的颜色,点击它们,下面的jquery隐藏/显示所选的颜色):
jQuery(document).ready(function($) {
$(":checkbox").bind("click", function (event) {
if($(this).is(':checked')) {
$(".itemBox:not(#" + $(this).val() + ")").hide();
$(".itemBox[id='" + $(this).val() + "']").show();
}
else {
$(".itemBox").show();
}
});
});
我的问题如下。项目显示方式如下,2乘2,所以当jquery隐藏/显示时,它只是将项目留在它们的位置,而不会重新组织它们。所以我看到项目以前显示的空白处,现在隐藏了。。。
你有什么建议来解决这个问题或强制PHP刷新吗?我尽量避免刷新整个页面。。。
while ($info = mysql_fetch_array($items))
{
if ($row_count % 2 == 0)
{
echo "<tr>";
}
echo "<td><div name='item' id='".$info[color_base1]."' class='itemBox'><div class='showItem'><a href='items_descr.php?itemId=".$info[id_item]."'><img class='itemImage' alt='' src='images/$info[imageMid].jpg'></img></div><br />";
echo "<div class='indexItemText'><font class='similarItemsText'><a href='items_descr.php?itemId=".$info[id_item]."'>".$info[name]."</a><font class='price'> - $".$info[price]."</div></td></div>";
$row_count++;
如果你只是把所有这些元素放在一个容器div和一个单独的项目div中,每个项目的CSS中都留有float,你可以写一些CSS,让它看起来一样,但当你用hide方法取出元素时,间隙会被去除。