Php 使用滚动条Jquery限制返回的结果_Php_Jquery_Mysql

Php 使用滚动条Jquery限制返回的结果

php jquery mysql

Php 使用滚动条Jquery限制返回的结果,php,jquery,mysql,Php,Jquery,Mysql,我正在使用以下代码在我的站点上生成动态shoutbox： HTML（index.HTML）我的手提箱姓名：信息： $（函数（）{ //第一次填充shoutbox 刷新_shoutbox（）； //每15秒重复刷新一次 setInterval（“refresh_shoutbox（）”，15000）； $（“#提交”）。单击（函数（）{ //获取用户键入的值 var name=$（“#name”）.val（）； var message=$（“#message”）.val（）； //形成查询串

我正在使用以下代码在我的站点上生成动态shoutbox：

HTML（index.HTML）


我的手提箱
姓名：
信息：
$（函数（）{
//第一次填充shoutbox
刷新_shoutbox（）；
//每15秒重复刷新一次
setInterval（“refresh_shoutbox（）”，15000）；
$（“#提交”）。单击（函数（）{
//获取用户键入的值
var name=$（“#name”）.val（）；
var message=$（“#message”）.val（）；
//形成查询串
变量数据='name='+name+'&message='+message；
//ajax调用
$.ajax({
类型：“POST”，
url:“shout.php”，
数据：数据，
success:function（html）{//在我们得到结果之后，就会发生这种情况
$（“#shout”）.slideToggle（500，function（）{
$（this.html（html）.slideToggle（500）；
$（“#消息”）.val（“”）；
});
}
});    
返回false；
});
});
函数刷新\u shoutbox（）{
变量数据='刷新=1'；
$.ajax({
类型：“POST”，
url:“shout.php”，
数据：数据，
success:function（html）{//在我们得到结果之后，就会发生这种情况
$（“#shout”）.html（html）；
}
});
}

PHP脚本（shout.PHP）

尝试将shout
放入容器元素中，并将滑块内容应用于该元素。
您是否希望编写$（“#消息”）.html（html）
而不是$（“#shout”）.html（html）？@thejh-实际上说得太快了。同样，滚动条在开始时工作得很好，但如果我真的插入数据，刷新只会将所有数据扩展到滚动条之外。我认为这是因为只要单击“提交”
，幻灯片日志内容就会被激活，但当“刷新”\u shoutbox（）

触发时，它可能会被覆盖。@thejh-我把我的两个完整脚本（html和php调用）放在一个更新的问题中。我认为你在上一篇文章中的假设是正确的，但它对我来说仍然没有意义，因为它应该属于相同的规则，因为返回的数据仍然在给定的集合内，而不是


<body>

<div id="page">

    <div class="block_main rounded">
        <h2>My Shoutbox</h2>

        <form method="post" action="shout.php">
            Name: <input type="text" id="name" name="name" />
            Message: <input type="text" id="message" name="message" class="message" /><input type="submit" id="submit" value="Submit" />
        </form>

        <div id="shout" style="padding:0 10px 0; overflow-x:hidden; height:225px;; overflow-y:auto;">

        </div>
    </div>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(function() {

    //populating shoutbox the first time
    refresh_shoutbox();
    // recurring refresh every 15 seconds
    setInterval("refresh_shoutbox()", 15000);

    $("#submit").click(function() {
        // getting the values that user typed
        var name    = $("#name").val();
        var message = $("#message").val();
        // forming the queryString
        var data            = 'name='+ name +'&message='+ message;

        // ajax call
        $.ajax({
            type: "POST",
            url: "shout.php",
            data: data,
            success: function(html){ // this happen after we get result
                $("#shout").slideToggle(500, function(){
                    $(this).html(html).slideToggle(500);
                    $("#message").val("");
                });
          }
        });    
        return false;
    });
});

function refresh_shoutbox() {
    var data = 'refresh=1';

    $.ajax({
            type: "POST",
            url: "shout.php",
            data: data,
            success: function(html){ // this happen after we get result
                $("#shout").html(html);
            }
        });
}


</script>
</body>

<?php
try {
    $dbh = new PDO('mysql:host=localhost;dbname=DB', 'User', 'PW');

if($_POST['name']) {
    $name       = $_POST['name'];
    $message    = $_POST['message'];
    $dbh->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);

    $sql = "INSERT INTO shoutbox (date_time, name, message) VALUES (NOW(), :name, :message)";
    $stmt = $dbh->prepare($sql);

    $stmt->bindParam(':name', $name, PDO::PARAM_STR);
    $stmt->bindParam(':message', $message, PDO::PARAM_STR);

    if ($stmt->execute()) {
        populate_shoutbox();
    }
} 
}
catch(PDOException $e) {
    echo $e->getMessage();
}

if($_POST['refresh']) {
    populate_shoutbox();
}


function populate_shoutbox() {
    global $dbh;
    $sql = "SELECT * FROM shoutbox ORDER BY date_time DESC limit 10";
    echo '<ul>';
    foreach ($dbh->query($sql) as $row) {
        echo '<li>';
        echo '<span class="date">'.date("m/d/Y g:i A", strtotime($row['date_time'])).'</span>';
        echo '<span class="name">'.$row['name'].'</span><br />';
        echo '<span class="message">'.$row['message'].'</span>';
        echo '</li>';
    }
    echo '</ul>';
}
?>