无限滚动与jQuery的MySQL和PHP

Question

I'm using this code for a project im working on infinite scrolling. 我正在将此代码用于正在进行无限滚动的项目。 everything works fine i just need to pass another parameter to my php file. 一切正常，我只需要将另一个参数传递给我的php文件。 for a example i need to pass "sortby = new" parameter to my php file. 例如，我需要将“ sortby = new”参数传递给我的php文件。 will be appropriate if you can tell me how to do it. 如果您能告诉我该怎么做将是适当的。

Index.php Index.php

<!DOCTYPE HTML>
<html>
<head>

<title>Scroll Pagination</title>

<link rel="stylesheet" type="text/css" href="style.css" />

<script src="jquery.js"> </script>
<script src="javascript.js"> </script>
<script type="text/javascript" src="//use.typekit.net/vue1oix.js"></script>
<script type="text/javascript">try{Typekit.load();}catch(e){}</script>

<style type="text/css">

</style>
<script>

$(document).ready(function() {

    $('#content').scrollPagination({

        nop     : 10, // The number of posts per scroll to be loaded
        offset  : 0, // Initial offset, begins at 0 in this case
        error   : 'No More Posts!', // When the user reaches the end this is the message that is
                                    // displayed. You can change this if you want.
        delay   : 500, // When you scroll down the posts will load after a delayed amount of time.
                       // This is mainly for usability concerns. You can alter this as you see fit
        scroll  : true // The main bit, if set to false posts will not load as the user scrolls. 
                       // but will still load if the user clicks.

    });

});

</script>

</head>
<body>

<div id="content">



</div>

</body>
</html>

ajex.php ajex.php

<?php

include('db.php');


$offset = is_numeric($_POST['offset']) ? $_POST['offset'] : die();
$postnumbers = is_numeric($_POST['number']) ? $_POST['number'] : die();


if($run = $mysqli->query("SELECT * FROM posts ORDER BY id DESC LIMIT ".$postnumbers." OFFSET ".$offset)){

    while($row = mysqli_fetch_array($run)) {

    $content = substr(strip_tags($row['description']), 0, 500);

    echo '<h1><a href="'.$row['id'].'">'.$row['title'].'</a></h1><hr />';
    echo '<p>'.$content.'...</p><hr />';

}

    $run->close();
}else{
     printf("Error: %s\n", $mysqli->error);
}

?>

JavaScript 的JavaScript

(function($) {

    $.fn.scrollPagination = function(options) {

        var settings = { 
            nop     : 10, // The number of posts per scroll to be loaded
            offset  : 0, // Initial offset, begins at 0 in this case
            error   : 'No More Posts!', // When the user reaches the end this is the message that is
                                        // displayed. You can change this if you want.
            delay   : 500, // When you scroll down the posts will load after a delayed amount of time.
                           // This is mainly for usability concerns. You can alter this as you see fit
            scroll  : true // The main bit, if set to false posts will not load as the user scrolls. 
                           // but will still load if the user clicks.
        }

        // Extend the options so they work with the plugin
        if(options) {
            $.extend(settings, options);
        }

        // For each so that we keep chainability.
        return this.each(function() {       

            // Some variables 
            $this = $(this);
            $settings = settings;
            var offset = $settings.offset;
            var busy = false; // Checks if the scroll action is happening 
                              // so we don't run it multiple times

            // Custom messages based on settings
            if($settings.scroll == true) $initmessage = 'Scroll for more or click here';
            else $initmessage = 'Click for more';

            // Append custom messages and extra UI
            $this.append('<div class="content"></div><div class="loading-bar">'+$initmessage+'</div>');

            function getData() {

                // Post data to ajax.php
                $.post('ajax.php', {

                    action        : 'scrollpagination',
                    number        : $settings.nop,
                    offset        : offset,

                }, function(data) {

                    // Change loading bar content (it may have been altered)
                    $this.find('.loading-bar').html($initmessage);

                    // If there is no data returned, there are no more posts to be shown. Show error
                    if(data == "") { 
                        $this.find('.loading-bar').html($settings.error);   
                    }
                    else {

                        // Offset increases
                        offset = offset+$settings.nop; 

                        // Append the data to the content div
                        $this.find('.content').append(data);

                        // No longer busy!  
                        busy = false;
                    }   

                });

            }   

            getData(); // Run function initially

            // If scrolling is enabled
            if($settings.scroll == true) {
                // .. and the user is scrolling
                $(window).scroll(function() {

                    // Check the user is at the bottom of the element
                    if($(window).scrollTop() + $(window).height() > $this.height() && !busy) {

                        // Now we are working, so busy is true
                        busy = true;

                        // Tell the user we're loading posts
                        $this.find('.loading-bar').html('Loading Posts');

                        // Run the function to fetch the data inside a delay
                        // This is useful if you have content in a footer you
                        // want the user to see.
                        setTimeout(function() {

                            getData();

                        }, $settings.delay);

                    }   
                });
            }

            // Also content can be loaded by clicking the loading bar/
            $this.find('.loading-bar').click(function() {

                if(busy == false) {
                    busy = true;
                    getData();
                }

            });

        });
    }

})(jQuery);

Answer 1

You should ad something like this in JavaScript (the value 'new' is hardcoded here, You should change it to Your needs): 您应该在JavaScript中投放类似这样的广告（值“ new”在此处经过硬编码，您应根据需要进行更改）：

  $.post('ajax.php', {
       action        : 'scrollpagination',
       number        : $settings.nop,
       offset        : offset,
       data: {
            sortby:'new',
       }

  },

Here is reference to $.post: 这里是对$ .post的引用：

http://api.jquery.com/jQuery.post/ http://api.jquery.com/jQuery.post/

无限滚动与jQuery的MySQL和PHP

问题描述

1 个解决方案

解决方案1
0 2013-06-06 07:38:56

无限滚动与jQuery的MySQL和PHP

问题描述

1 个解决方案

解决方案1 0 2013-06-06 07:38:56

解决方案1
0 2013-06-06 07:38:56