在Codeigniter中使用jQuery和Ajax进行Div刷新

Question

我想在codeigniter中刷新div 2秒。我有几个使用setInterval（）方法的代码。有些使用location.reload（）; 。我想做一个聊天应用程序。并不想刷新整个页面。我只想在2秒内刷新一个div。我在视图页面中编写模型代码和javascript代码，代码如下。

<div class="msgp <?php if (isset($_SESSION['chat_msg'])) echo 'open-chatApp'; ?>">

<div class="text-right">
    <span class="close-cht"><i class="fa fa-times" aria-hidden="true"></i></span>
</div>
<?php
$chat_user = $_SESSION['chat_msg'];
//unset($_SESSION['chat_msg']);
$chat_msgs = $this->db->get_where('livechat_msg', array('nickname' => $chat_user))->result();
if (!isset($chat_user)) {
    ?>

    <form action="" method="post" id="chat_form">
        <i class="icofont spt icofont-live-support"></i>
        <input type="text" placeholder="nickname" class="form-control" id="nickname" required>
        <input type="text" placeholder="mobile" class="form-control" id="mobile" required>
        <input type="button" value="submit" id="chat_reg">
        <span id="valid_msg"></span>
    </form>
<?php } else { ?>
    <div id="msg_area">

        <ul class="messageParent">


            <li class="singleMessage left">
                <div class="messageThumb">
                    <img src="https://via.placeholder.com/35x35" alt="" class="img-circle">
                </div>
                <div class="messgaeContent">
                    <span> How Can I help you ? </span>
                </div>
            </li>

            <?php
            foreach ($chat_msgs as $chat) {
                echo $_SESSION['chat_msg'];
                ?>
                <?php if ($chat->admin_id == 1) { ?>
                    <li class="singleMessage left">
                        <div class="messageThumb">
                            <img src="https://via.placeholder.com/35x35" alt="" class="img-circle">
                        </div>
                        <div class="messgaeContent">
                            <span> <?php echo $chat->msg; ?></span>
                        </div>
                    </li>
                <?php } else { ?>
                    <li class="singleMessage right">
                        <div class="messageThumb">
                            <img src="https://via.placeholder.com/35x35" alt="" class="img-circle">
                        </div>
                        <div class="messgaeContent">
                            <span> <?php
                                echo $chat->msg;
                                echo $_SESSION['chat_msg'];
                                ?> </span>
                        </div>
                    </li>
                    <?php
                }
            }
            ?>
        </ul>
        <?php print_r($_SESSION['chat_msg']); ?>
        <div class="messageTextInput">
            <form method="#" action="#">
                <textarea class="form-control" style=" resize: none" rows="4" name="message" required=""></textarea>
                <input type="hidden" id="nickname" name="nickname" value="<?php echo $_SESSION['chat_msg']; ?>">
                <div class="text-right">
                    <input type="button" class="cat-btn" id="msg_send" value="send"> 
                </div>

            </form>
        </div>
    </div>
<?php } ?>

以及下面的js代码

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

     //setTimeout("location.reload(true);",2000);
    //$("#msg_area").reload();
    $("#chat_reg").on('click', function () {
        setInterval(refreshMessages, 1000);

        nickname = $("#nickname").val();
        mobile = $("#mobile").val();

        function refreshMessages(){

        if (nickname == '' || mobile == '') {
            $("#valid_msg").html('nickname/ mobile does not empty');
        } else {
            $.ajax({
                type: 'POST',
                url: '<?php echo base_url(); ?>website/livechatsend',
                ContentType: 'application/json',
                data: {
                    nickname: nickname,
                    mobile: mobile,
                    '<?php echo $this->security->get_csrf_token_name(); ?>': '<?php echo $this->security->get_csrf_hash(); ?>'
                },
                success: function (data) {
                    res = jQuery.parseJSON(data);

                    $("#msg_area").html(data);
                    $("#chat_form").hide();

                }
            });

        }
        }
    });

    $("#msg_send").on('click', function () {
        $(".messageParent").append('lkhdfghdfkg');
    });
});