jQuery Plugin to update live a <li> from PHP

十年热恋 提交于 2019-12-03 14:12:42

问题


is there any jQuery plugin to create something like the live feed from the Twitter Main Page , using PHP, which is getting the data from a MySQL database?
How has to be the PHP file?
Thanks.


回答1:


You really don't need a plugin for this, you could easily create something similar yourself using jQuery to make AJAX calls to a PHP MySQL feed

Create a script to make reoccurring AJAX calls using setTimeout() and then add the new found results to the feed container using .prepend()

HTML

<html>
<head><title>Tweets</title>

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

<style>
#tweets {
    width: 500px;
    font-family: Helvetica, Arial, sans-serif;
}
#tweets li {
    background-color: #E5EECC;
    margin: 2px;
    list-style-type: none;
}
.author {
    font-weight: bold
}
.date {
    font-size: 10px;
}
</style>

<script>
jQuery(document).ready(function() {
    setInterval("showNewTweets()", 1000);
});

function showNewTweets() {
    $.getJSON("feed.php", null, function(data) {
        if (data != null) {
            $("#tweets").prepend($("<li><span class=\"author\">" + data.author + "</span> " +  data.tweet + "<br /><span class=\"date\">" + data.date + "</span></li>").fadeIn("slow"));
        }
    });
}
</script>

</head>
<body>

<ul id="tweets"></ul>

</body>
</html>

PHP

<?php
echo json_encode(array( "author" => "someone",
                        "tweet" => "The time is: " . time(), 
                        "date" => date('l jS \of F Y h:i:s A')));
?>



回答2:


setInterval() would be more adequate, since you want a check at regular intervals.

Then, there is a jquery comet plugin that explores the implementation of the "push" technology. Check it out here.




回答3:


var frequency = 5000,  // number of milliseconds between updates.

    updater   = function() {
        jQuery.ajax({
            url: 'http://twitter.com/example/something.html',
            success: function(data) {
                // update your page based upon the value of data, e.g.:
                jQuery('ul#feed').append('<li>' + data + '</li>');
            }
        });
    },

    interval  = setInterval(updater, frequency);



回答4:


<script>
        $(document).ready(function(){

            var frequency = 10000; // 10 seconds = 10000

            var updater   = function() {
                $.ajax({
                    url: 'mesaj.html', // data source html php
                    cache: false,
                    success: function(data) {
                        $("#message").html(data); // div id
                    }
                }); 
            };

            interval  = setInterval(updater, frequency);
        });
</script>

example

<div id="message">{ do not write }</div>


来源:https://stackoverflow.com/questions/2798785/jquery-plugin-to-update-live-a-li-from-php

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!