单击时显示更改问题答案

【问题标题】：on click change questions displayed单击时显示更改问题
【发布时间】：2011-08-03 13:58:47
【问题描述】：

我有一个包含项目列表的页面。页面底部是一个“查看更多”按钮。当有人点击此按钮时，页面需要添加更多项目。 var 是 $displayedquestions，当单击“查看更多”按钮时，页面现在被编码为刷新，但我们希望让它实时运行。如何做到这一点？

代码如下：

<?php
include "db_connect.php";
db_connect();

function tags($tags)
{
    $tagarray=explode(",",$tags);
    $i=0;
    $finished='false';
    while($finished=='false') {
        if (empty($tagarray[$i])=='true') {
            $finished='true';
        } else {
            $taglist = $taglist . '<a class="commonTagNames" href="">' . $tagarray[$i] . '</a> &nbsp;';
            $i++;
        }
    }
    return $taglist;
}


function formattime($timesince)
{
    $strsince=number_format($timesince,0,'','');
    $nodecimals=intval($strsince);
    if ($nodecimals<1){
        return "Less than a minute ago";
    } elseif ($nodecimals>=1&&$nodecimals<60) {
        return $nodecimals . " min ago";
    } elseif ($nodecimals>60&&$nodecimals<1440){
        $hourssince=$nodecimals/60;
        $hoursnodecimals=number_format($hourssince,0);
        return $hoursnodecimals . " hours ago";
    } elseif ($nodecimals>1440){
        $dayssince=$nodecimals/1440;
        $daysnodecimals=number_format($dayssince,0);
        return $daysnodecimals . " days ago";
    }
}

$submitbutton=$_REQUEST['viewmore'];
$numquestions=intval($_REQUEST['questions']);
if($numquestions!=0) {
    $displayedquestions=$numquestions;
} else {
    $displayedquestions=10;
}

$sql="SELECT * FROM `Questions` ORDER BY `Questions`.`ID`  DESC LIMIT 0, " . $displayedquestions;
$questions=mysql_query($sql);
while($row = mysql_fetch_array($questions))
{
$id = $row['ID'];
$user = $row['userAsking'];
$question = $row['question'];
$tags = $row['tags'];
$timestamp = $row['timestamp'];
$time=strtotime($timestamp);
$secondssince=(date(U)-$time)/60;
$timesince=formattime($secondssince);
$responses=mysql_query("SELECT * FROM `answersToQuestions` WHERE `idOfQuestion`= '$id'");
$comments=mysql_num_rows($responses);
$likes=mysql_query("SELECT * FROM `likesOfQuestions` WHERE `idOfQuestion`= '$id'");
$numlikes=mysql_num_rows($likes);
$userprofileq = mysql_query("SELECT `ID`,`avatar` FROM `Users` WHERE `username` = '$user'");
$userprofileresult = mysql_fetch_row($userprofileq);
$linktoprofile = $userprofileresult[0];
$avatar = $userprofileresult[1];
$taglist=tags($tags);

        echo "</li>";


                        echo '<li class="questionsList" onclick="showUser(' . $id  . ')">
                            <div id="questionPadding">
                            <img class="askerImage" width=50 height=50 src="../Images/userimages/' . $avatar . '.png"/>
                            <div class="questionFirstRow"><h1 class="questionTitle">' . $question . '</h1></div>
                            <span class="midRow">
                            <span class="askerSpan"><a class="askerName" href="">'. $user .'</a></span>
                            </span>
                            <span class="bottomRow">                                
                                <img src="../Images/comment.png"/>
                                <span class="comments">' . $comments . '</span>
                                <img src="../Images/likes.png"/>
                                <span class="likes">' . $numlikes . '</span>
                                ' . $timesince . ' 
                            </span>
                            </div>
                        </li>';


}


?>

<center><a href="index.php?questions=<?php  echo $displayedquestions+10; ?>"><img class="moreQuestions" src="../Images/viewMoreBar.png" alt="More" /></a></center>

【问题讨论】：

你必须使用 jQuery 阅读更多 plugin
哦，所以你认为页面应该加载所有项目，这可能是一个巨大的数量，然后只是折叠它们或其他东西。我知道如何用 jquery 做到这一点，但这似乎是服务器过载。
你所说的“做生活”是什么意思？
这是一个相当艰巨的任务。我能够找到一篇博客文章，其中有一个很好的例子，您可以从中获得一些指导：giantflyingsaucer.com/blog/?p=2581
你的标签函数可以这样写function tags($tags) { $tagarray=explode(",",$tags); $i=0; $taglist=''; foreach($tagarray as $key) { $taglist .= '<a class="commonTagNames" href="">' . $key . '</a> &nbsp;'; $i++; } return $taglist; }

标签： php jquery refresh

【解决方案1】：

无需做大量工作，您就可以在其中添加 ajax。使用这个功能：

首先，（我假设您将上面的代码包含在另一个文件中）围绕它创建一个容器。例如：

<div id='container'>...</div>

其次，将此 javascript 添加到包含上述代码的页面：

<script type="text/javascript">
    $(function(){
        $("#container img.moreQuestions").parent().live('click', (function (e) { 
                e.preventDefault();
                $("#container").load($(this).attr("href"));
            });
        });
    });
</script>

这将加载到#container 您已有的脚本，而无需刷新页面的其余部分。

注意在我的示例中，More 链接（斜杠按钮）的选择器是 $("#container img.moreQuestions").parent()，因为您没有类或 ID。您应该为 More 链接提供一个类或 id 并将其用于选择器。

【讨论】：

【解决方案2】：

就像@diEcho 提到的，jQuery 将是一个很大的帮助：您可以通过 ajax 轻松刷新您的项目列表（例如从 php 文件中检索完整列表）以及使用新添加的值更新您的 DOM 元素。试一试。此外，您还应该考虑通过 ajax 获取初始项目。数据逻辑/显示/UI功能以这种方式完全分离。

【讨论】：