我希望更新未讀消息的數量，並在用戶收到新消息時播放通知聲音。 我正在使用PHP，MySql，Javascript

Question

<!-- Message Notifications -->
        <li class="notifications dropdown">
            <?php
            $total_unread_message_number = 0;
            $current_user = $this->session->userdata('login_type') . '-' . $this->session->userdata('login_user_id');

            $this->db->where('sender', $current_user);
            $this->db->or_where('reciever', $current_user);
            $message_threads = $this->db->get('message_thread')->result_array();
            foreach ($message_threads as $row) {
                $unread_message_number = $this->crud_model->count_unread_message_of_thread($row['message_thread_code']);
                $total_unread_message_number += $unread_message_number;
            }
            ?>
            <a href="#" class="dropdown-toggle" data-toggle="dropdown" data-hover="dropdown" data-close-others="true">
                <i class="entypo-mail"></i>
                <?php if ($total_unread_message_number > 0): ?>
                    <span class="badge badge-info"><?php echo $total_unread_message_number; ?></span>

                <!--Javascript message sound notification-->
                <script>
                $(function(){  

                  $('<audio id="chatAudio"><source src="assets/sounds/notify.ogg" type="audio/ogg"><source src="assets/sounds/notify.mp3" type="audio/mpeg"><source    src="assets/sounds/notify.wav" type="audio/wav"></audio>').appendTo('body');;
                  $('#chatAudio')[0].play();

                  });
                </script>

                <?php endif; ?>
            </a>

上面的代碼在標題部分中，因此，只要重新加載頁面（因為有未讀消息），就會播放通知聲音。 但是我希望它通知能夠立即播放，消息進入數據庫。

Answer 1

在這種情況下，您需要調用.php文件，該文件會使用AJAX定期返回未讀消息的數量。

代碼看起來像這樣：

var INTERVAL_IN_MILISECONDS = 5000; // 5s
function checkForUnreadMessages() {
    $.get("getUnreadMessagesCount.php")
    .done(function(unreadMessagesCount) {
        if (unreadMessagesCount > 0) {
            $('<audio id="chatAudio"><source src="assets/sounds/notify.ogg" type="audio/ogg"><source src="assets/sounds/notify.mp3" type="audio/mpeg"><source    src="assets/sounds/notify.wav" type="audio/wav"></audio>').appendTo('body');
            $('#chatAudio')[0].play();
        }
    });
}
checkForUnreadMessages();
setInterval(checkForUnreadMessages, INTERVAL_IN_MILISECONDS);