jQuery的负载更多的按钮，只有当有什么东西加载 [英] Jquery load more button ONLY when there's something to load

问题描述

我目前使用的脚本我发现hycus.com到我的网页上创建点击功能的负荷了。当你点击加载更多的按钮，它获取的数据从服务器使用AJAX显示。它工作正常，但我的问题是这样的...加载更多的按钮仍然显示，即使没有数据显示。

我希望负载更多的按钮显示仅在有数据显示，当没有数据显示消失。

索引页： jQuery的

 ＆LT;脚本类型=文/ JavaScript的＆GT;
        $（文件）。就绪（函数（）{
            $（＃loadmorebutton）。点击（函数（）{
                $（'＃loadmorebutton）HTML（'＆LT; IMG SRC =AJAX-loader.gif/＆GT;'）;
                $阿贾克斯（{
                    网址：loadmore.php lastid =+ $（。postitem：最后一个）。ATTR（ID），
                    成功：函数（HTML）{
                        如果（HTML）{
                            $（＃postswrapper）追加（HTML）。
                            $（'＃loadmorebutton）HTML（加载更多）;
                        }其他{
                            $（'＃loadmorebutton）replaceWith（'＆LT;中心＆GT;没有更多内容＆LT; /中心＆GT;'）。
                        }
                    }
                }）;
            }）;
        }）;
    ＆LT; / SCRIPT＆GT;
 

HTML：

 ＆LT; D​​IV ID =包装＆GT;
＆LT; D​​IV ID =postswrapper＆GT;
＆LT; PHP
    $的GetList =请求mysql_query（SELECT * FROM table_name的LIMIT 25）;
    而（$ GL = mysql_fetch_array（$的GetList））{＆GT？;
         ＆LT; D​​IV CLASS = postitem ID =＆LT ;?回声$ GL ['身份证'];？＆GT;＆GT;＆LT; PHP的echo $ GL ['标题']; ？＆GT;＆LT; / DIV＆GT;
    ＆LT; PHP}＆GT？;
＆LT; / DIV＆GT;
＆LT;按钮ID =loadmorebutton＆GT;负载详情＆lt; /按钮＆GT;
＆LT; / DIV＆GT;
＆LT; / DIV＆GT;
 

该loadmore.php页面有;

 ＆LT; PHP
$的GetList =请求mysql_query（SELECT * FROM table_name的WHERE ID＆LT;'.addslashes（$ _ GET ['lastid']）。
LIMIT 0，25 LIMIT 10）;
而（$ GL = mysql_fetch_array（$的GetList））{＆GT？;
＆LT; D​​IV＆GT;＆LT; PHP的echo $ GL ['标题']; ？＆GT;＆LT; / DIV＆GT;
＆LT; PHP}＆GT？;
 

基本上他们这个脚本的作用是，索引页将加载从数据库中的第25个项目，当你负载点击更多，它会触发loadmore.php，这将装载10多个数据从上次ID开始装了。我想要做的是......从屏幕上删除的负载更多，如果有小于25个项目在数据库中，并显示是否有超过25个项目在数据库中。

解决方案

 ＆LT; PHP
    $的GetList =请求mysql_query（SELECT * FROM table_name的LIMIT 25）;
    而（$ GL = mysql_fetch_array（$的GetList））{＆GT？;
         ＆LT; D​​IV CLASS = postitem ID =＆LT ;?回声$ GL ['身份证'];？＆GT;＆GT;＆LT; PHP的echo $ GL ['标题']; ？＆GT;＆LT; / DIV＆GT;
    ＆LT; PHP}
    如果（mysql_num_rows（$的GetList）＆LT; = 25）{＆GT;
    ＆LT;脚本类型=文/ JavaScript的＆GT;
        $（函数（）{
             $（'＃loadmorebutton）隐藏（）。
        }）;
    ＆LT; / SCRIPT＆GT;
    ＆LT; PHP}＆GT？;
 

I am currently using a script I found on hycus.com to create a load more on click feature on my page. When you click on the load more button, it fetches data from the server and displays it using ajax. It works fine but the problem I have is this...the load more button still shows up even when there's no data to show.

I want the load more button to show ONLY when there's data to show and disappear when there's no data to show.

index page: jquery

<script type="text/javascript">
        $(document).ready(function(){
            $("#loadmorebutton").click(function (){
                $('#loadmorebutton').html('<img src="ajax-loader.gif" />');
                $.ajax({
                    url: "loadmore.php?lastid=" + $(".postitem:last").attr("id"),
                    success: function(html){
                        if(html){
                            $("#postswrapper").append(html);
                            $('#loadmorebutton').html('Load More');
                        }else{
                            $('#loadmorebutton').replaceWith('<center>No more posts to show.</center>');
                        }
                    }
                });
            });
        });
    </script>

Html:

<div id="wrapper">
<div id="postswrapper">
<?php 
    $getlist = mysql_query("SELECT * FROM table_name LIMIT 25"); 
    while ($gl = mysql_fetch_array($getlist)) { ?>
         <div class=postitem id="<? echo $gl['id']; ?>"><?php echo $gl['title']; ?></div>
    <?php } ?>
</div>
<button id="loadmorebutton">Load More</button>
</div>
</div>

The loadmore.php page has;

<?php 
$getlist = mysql_query("SELECT * FROM table_name WHERE id < '".addslashes($_GET['lastid'])."' 
LIMIT 0, 25 LIMIT 10"); 
while ($gl = mysql_fetch_array($getlist)) { ?>
<div><?php echo $gl['title']; ?></div>
<?php } ?>

Basically what it this script does is, the index page will load the first 25 items from the database, and when you click on load more, it triggers loadmore.php, which will load 10 more the data starting from the last id loaded already. What I want to do is...to remove the Load more from the screen IF there's less than 25 items in the database and show if there's more than 25 items in the database.

解决方案

<?php 
    $getlist = mysql_query("SELECT * FROM table_name LIMIT 25"); 
    while ($gl = mysql_fetch_array($getlist)) { ?>
         <div class=postitem id="<? echo $gl['id']; ?>"><?php echo $gl['title']; ?></div>
    <?php } 
    if(mysql_num_rows($getlist) <= 25) { ?>
    <script type="text/javascript">
        $(function(){
             $('#loadmorebutton').hide();
        });
    </script>
    <?php } ?>

这篇关于jQuery的负载更多的按钮，只有当有什么东西加载的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！