Jquery hide/show load more button

问题

I have a script, see below:

Index page: jQuery script

<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" button 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.

回答1:

This will work for you:

<?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 } ?>

回答2:

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

回答3:

chagne your php script to with coount variable

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

---

<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);                
                            var count = patserInt($('#loadmorebutton').val()); 
                if(count<25){
                        $('#loadmorebutton').html('Load More'); 
                        }else {
                            $('#loadmorebutton').hide();


                        }else{ 
                            $('#loadmorebutton').replaceWith('<center>No more posts to show.</center>'); 
                        } 
                    } 
                }); 
            }); 
        }); 
    </script> 

回答4:

I'll give you two options, whichever is more readable to you.

<?php if(25 or more){ ?>
  <button id="loadmorebutton">Load More</button>
<?php } ?>

<?php if(25 or more): ?>
  <button id="loadmorebutton">Load More</button>
<?php endif; ?>

来源：https://stackoverflow.com/questions/8120743/jquery-hide-show-load-more-button