在 php 和 mysql 中使用 javascript 进行分页

Question

我正在尝试使用 javascript 进行分页，但都是徒劳的，请帮助..

<script language="Javascript">
function nextclicked()
{ 
document.getElementById("clickednext").value = document.getElementById("clickednext").value + 1;
document.forms["newsmanager"].submit();
}
</script>

<form name = "newsmanager" method="post" action="NewsManager.php">
<input type = "hidden"  id="clickednext" name="clickednext" > 


if(isset($_POST['clickednext']) && $_POST['clickednext']>=1)
{    
$_POST['clickednext'] = $_POST['clickednext'] +9; 
$NewsQuery = "SELECT NewsDetails FROM News LIMIT " .$_POST['clickednext']. ",10";
    }
    else
    {
    $NewsQuery  = "SELECT NewsDetails FROM News LIMIT 0,10";
    }

    $result = mysqli_query($dbc,$NewsQuery);
}

更新：

     <div class=d2 align=left>
<a  href="#" onclick=" nextclicked(); submit();" >
Next
</a>

更新结束......

当我第一次单击 Next 超链接标签时，它会起作用，也就是说，分配了 10 个 $_POST['clickednext'] 并且接下来的 10 个值从数据库中出现，但是我第二次单击标签时，那么它没有？

Answer 1

PHP 是服务器端语言。你必须把你的 php 代码放到

<?php

=====

<script language="Javascript">
function nextclicked()
{ 
document.getElementById("next").value = document.getElementById("next").value + 1;
document.forms["newsmanager"].submit();
}
</script>

<form name = "newsmanager" method="post" action="NewsManager.php">
<input type = "hidden"  id="clickednext" name="clickednext" > 

<?php
if(isset($_POST['clickednext']) && $_POST['clickednext']>=1)
{    
$_POST['clickednext'] = $_POST['clickednext'] +9; 
$NewsQuery = "SELECT NewsDetails FROM News LIMIT " .intval($_POST['clickednext']). ",10";
    }
    else
    {
    $NewsQuery  = "SELECT NewsDetails FROM News LIMIT 0,10";
    }

    $result = mysqli_query($dbc,$NewsQuery);
}
?>

此外，用户不能点击隐藏的表单域。例如，您需要按钮并准备好 onclick 事件

<button name="next" value="1" onclick="nextclicked();">Next</button>

Answer 2

这是我使用php编写的一个小算法来创建分页：

$x=$numStories;
$y=$x%5;
$z=($x-$y)/5;
if($y!=0){
    $numPages=$z+1;
}
else{
    $numPages=$z;
}

其中 5 是每页的故事数，$numStories 是您希望使用的故事（或在您的情况下为新闻文章）的总数。

然后，只需以您喜欢的任何方式显示页面数量 ($numPages)，一切顺利。

[编辑]

我创建了一个archive.php 页面，它将页码作为 GET 参数 (archive.php?page=3)。从那里，我选择了数据库中$pageNum（在本例中为 3）*10（或者您希望在每页显示多少帖子）之后的前五个条目。

最好的办法是让你的代码尽可能地动态和灵活，这样它就可以自我维持。

[编辑 2]

<script>
function nextclicked()
{ 
    document.forms["newsmanager"].submit();
}
</script>

<?php
    $currentPage = $_POST['page'];

    $numStories = //get the total amount of entries
    $x=$numStories;
    $y=$x%10;
    $z=($x-$y)/10;
    if($y!=0){
        $numPages=$z+1;
    }
    else{
        $numPages=$z;
    }

    if(isset($currentPage) && $currentPage>=1)
    {    
    $currentPage = $currentPage +9; 
    $NewsQuery = "SELECT NewsDetails FROM News LIMIT " .$currentPage. ",10";
        }
        else
        {
        $NewsQuery  = "SELECT NewsDetails FROM News LIMIT 0,10";
        }

        $result = mysqli_query($dbc,$NewsQuery);
    }

?>

<form>
    <input type='hidden' name='page' text='' value='<?php echo "$currentPage"' />
</form>
<a href="#" onclick="nextClicked()">Next--></a>

Answer 3

您的代码完全错误。 你应该放弃它并重新开始。 我会告诉你怎么做。

我有一个关于 Ajax 的规则，它是这样的。 如果没有 Ajax 就无法实现该功能，那么就不能尝试使用 Ajax。

如果您对 javascript 有所了解，您就会知道 XmlHttpRequest 使使用 Ajax 变得非常糟糕。因此我们有 javascript 框架，例如 JQuery 和 Mootools。您可能还喜欢一个名为 PHPLiveX 的 php ajax 框架。我只使用JQuery，所以这里是如何在JQuery中做解决方案。

第 1 步：剥离 ajax 并在 php 中创建解决方案

This pagination tutorial in php will help.

第 2a 步：使用 PHPLiveX 创建 ajax PHPLiveX 真的很酷而且被低估了，因为它允许您使用 php 函数而无需重新加载整个页面，以一种比使用 javascript 更方便的方式。

PHPLiveX will help you the best. 这很简单。你调用一个 php 函数来做某事，返回一些值，然后选择目标：你希望值去哪里。

我个人会使用 PHPLiveX 来完成这项工作，因为它更适合。 JQuery 更适用于 postdata。

第 2b 步：在 JQuery 中创建 ajax

我将假设您知道如何使用 JQuery 按 id 选择元素并附加或替换它们。如果没有，您可以查找该功能。

以下是使用 JQuery 提交 POST 或 GET 所需的代码。将此适应您的代码。您必须修改下面的代码以添加附加内容。

$(".tornfieldcard").click(function() {

    var dataString = $("#addfieldForm").serialize();
        //lets get the form data and use that
    var newValue = $("#newValue").val();
    var itemid4 = $(this).attr("itemid4");
    var dataString = "itemid=" + itemid + "&newValue=" + newValue;
        //or get the attr/valu from elements

    $("#loading5").show();
    $("#loading5").fadeIn(400).html('<img src="icons/loading.gif">');

    $.ajax({
    type: "POST",
    url: "ajaxcontrols.php",
    data: dataString,
    cache: false,
    success: function(html){

    $("#loading5").remove();
    $(".fieldcardNEW").fadeOut('slow');
    $('.fieldcardNEW').remove();

    $("#conveyorbelt_"+itemid4+"").append("<div class=\"fieldcard\"><b>"+attribute+"</b>  <br><div itemid=\""+itemid4+"\" attribute=\""+attribute+"\">"+value+"</div></div>");
    }
});