Question

我有一个简单的脚本，它使用AJAX查找数据库表中的更改，如果检测到更改，则返回该表中的信息。

以下是我的来源：http://blog.codebusters.pl/en/ajax-auto-refresh-volume-ii/#comment-570

我还有用JS / JQ编写的这个漂亮的通知横幅：http://www.jqueryscript.net/other/Simple-jQuery-Sticky-Notification-Plugin-Notify-Me.html

我同时独立工作，因为更新器会自动更新Div，并且按钮按下时会激活通知。

以下是更新程序的接收div的代码：

<div id="message-list" data-counter="<?php echo (int)$db->check_changes();?>">
    <?php echo $db->get_news();?>
</div>

据我所知，当数据计数器发生变化时，会调用get_news（）。

这是get_news（） - 这是在类下定义的PHP函数：

function get_news(){
    if($result = $this->dbase->query('SELECT * FROM cmc_log WHERE id<>1 ORDER BY time DESC LIMIT 1')){
        $return = '';
        while($r = $result->fetch_object()){
            $return .= '<p> '.$r->time.' | '.htmlspecialchars($r->message).'</p>';  
        }
        return $return;
    }
}

对于通知系统，我有：

<div class="container">

    <div class="btn-group">
        <a class="btn error"><i class="fa fa-warning"></i> Error</a>      
    </div>
</div>

<!-- SCRIPTS -->
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="assets/js/notifyme.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $('.error').on('click', function(){
        $(this).notifyMe(
            'top',
            'error',
            'Lorem Ipsum Text',
            'Lorem ipsum dolos lorem uisnsnd h jsakdh ajkdbh',
            600
        );
    });
});
</script>

我希望在新闻可用时调用通知横幅，即我猜想在get_news（）上。但是我还需要将get_news（）的输出合并到实际的横幅中...我想我已经把自己弄到什么地方了！[/ p>

任何帮助表示赞赏！谢谢，

更新！因此，自动刷新脚本的作者发布并提醒我关于AJAX，这当然是触发的最佳位置。

<script>
    /* AJAX request to checker */
    function check(){

        $.ajax({
            type: 'POST',
            url: 'checker.php',
            dataType: 'json',
            data: {
                counter:$('#message-list').data('counter')
            }
        }).done(function( response ) {
            /* update counter */

            $('#message-list').data('counter',response.current);

            /* check if with response we got a new update */

            if(response.update==true){
                $('#message-list').html(response.newsf);
                $('#message-list2').html(response.news);
                //fire notification

                $(this).notifyMe(
'top',
'error',
'Update available:',
response.news.val,
400);

            }
        });
    }
    //Every 10 sec check if there is new update
    setInterval(check,10000);
</script>

我还要解决的最后一件事是如何将$('#message-list2').html(response.news);的值作为字符串输入到notifyMe（）调用中？

回答： 得到它的工作：可能比填充隐藏的div更简洁，但至少它现在正在工作！

<script>
    /* AJAX request to checker */
    function check(){

        $.ajax({
            type: 'POST',
            url: 'checker.php',
            dataType: 'json',
            data: {
                counter:$('#message-list').data('counter')
            }
        }).done(function( response ) {
            /* update counter */

            $('#message-list').data('counter',response.current);

            /* check if with response we got a new update */

            if(response.update==true){
                $('#message-list').html(response.newsf);
                $('#message-list2').html(response.news);
                //fire notification

                $(this).notifyMe('top','error','Update available:',document.getElementById('message-list2').innerHTML,400);

            }
        });
    }
    //Every 20 sec check if there is new update
    setInterval(check,10000);
</script>

Previous alerts:

<div style="padding-left:10px" id="message-list" data-counter="<?php echo (int)$db->check_changes();?>">
    <?php echo $db->get_news_full();?>
</div>

<div style="display: none;" id="message-list2" data-counter="<?php echo (int)$db->check_changes();?>">
    <?php echo $db->get_news();?>
</div>

尼克

Answer 1

在ajax完成且response.update为true之后，您需要在有新条目时触发click。这样的事情：

    function check(){
        $.ajax({
            type: 'POST',
            url: 'checker.php',
            dataType: 'json',
            data: {
                counter:$('#message-list').data('counter')
            }
        }).done(function( response ) {
            /* update counter */
            $('#message-list').data('counter',response.current);
            /* check if with response we got a new update */
            if(response.update==true){
                $('#message-list').html(response.news);

                //we have new entries so we want to open the notify thing, so we trigger click, I'm assuming the click is for $('.error')
                $('.error').trigger('click'); 
            }
        });
    }

Answer 2

<script>
    /* AJAX request to checker */
    function check(){

        $.ajax({
            type: 'POST',
            url: 'checker.php',
            dataType: 'json',
            data: {
                counter:$('#message-list').data('counter')
            }
        }).done(function( response ) {
            /* update counter */

            $('#message-list').data('counter',response.current);

            /* check if with response we got a new update */

            if(response.update==true){
                $('#message-list').html(response.newsf);
                $('#message-list2').html(response.news);
                //fire notification

                $(this).notifyMe('top','error','Update available:',document.getElementById('message-list2').innerHTML,400);

            }
        });
    }
    //Every 20 sec check if there is new update
    setInterval(check,10000);
</script>

Previous alerts:

<div style="padding-left:10px" id="message-list" data-counter="<?php echo (int)$db->check_changes();?>">
    <?php echo $db->get_news_full();?>
</div>

<div style="display: none;" id="message-list2" data-counter="<?php echo (int)$db->check_changes();?>">
    <?php echo $db->get_news();?>
</div>

结合Jquery，AJAX和PHP麻烦

2 个答案: