JavaScript,如何在不刷新和自动滚动的情况下自动更新div内容

时间:2014-02-02 23:48:14

标签: javascript php jquery html

我已经被告知这可以通过javascript实现,但我真的很新用PHP,我想在我开始使用javascript之前结束我的学习,我只是为了练习进行简单的聊天,它记录消息,它用您的名字创建会话并将您注销,但我不想刷新整个页面以查看是否有人在我的聊天中说了些什么,发布了我的文件:

的index.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml">  
<head>  
<title>Chat - Customer Module</title>  
<link href="dist/css/bootstrap.css" rel="stylesheet">  
<link href="style.css" rel="stylesheet">
<?php
date_default_timezone_set('America/Caracas');
include('action.php');
?>
</head>  
<body>  
<?php
if(!isset($_SESSION['name']))
    loginform();

if(isset($_SESSION['name']))
{
    include('chat.php');
}
var_dump($_SESSION);
var_dump($_COOKIE);
var_dump($_POST);
?>
</body>  
</html> 

im打印var_dumps以查看是否所有内容都按预期进行。

action.php的

<?php
session_start();

function loginform()
{
    echo '<div id="loginform">';
    echo '<form action="index.php" method="post">';
            echo '<p>Please enter your name to continue:</p>';
            echo '<label for="name">Name:</label>';
            echo '<input type="text" name="name" id="name" />';
            echo '<input type="submit" name="enter" id="enter" value="Enter" class="btn" />';
    echo '</form>';
    echo '</div>';
}

if(isset($_POST['enter']))
{
    if($_POST['name'] != '')
    {
        $_SESSION['name'] = stripslashes(htmlspecialchars($_POST['name']));
    }
    else
    {
        echo '<span class="error">You input an invalid name</span>';
    }
}

if(isset($_SESSION['name']))
{
    if(isset($_POST['usermsg']))
    {
        $text = $_POST['usermsg'];

        $fp = fopen('log.html', 'a');
        fwrite($fp, "<div class='msgl'>(".date("g:i A").") <b>".$_SESSION['name']."</b>: ".stripslashes(htmlspecialchars($text))."<br></div>");
        fclose($fp);
    }
}

if(isset($_POST['exit']))
{
    $fp = fopen('log.html', 'a');
    fwrite($fp, "<div class='msgln'>(".date("g:i A").") <i>User <b>". $_SESSION['name'] ."</b> has left the chat session.</i><br></div>");
    fclose($fp);

    session_destroy();
    header('Location: index.php');
}

?>

chat.php

<div id="wrapper">
    <div id="menu">
        <div class="welcome"> Welcome, <b><?php echo $_SESSION['name']; ?></b>.</div>
        <div class="logout"> <form method="POST"><input type="submit" id="exit" name="exit" value="Exit" class="btn btn-danger"></form></div>
    </div>
    <div id="chatbox">
        <?php 
        if(file_exists('log.html'))
            echo file_get_contents('log.html');

        else
            echo 'ERROR: log empty or it wasnt found.';
        ?>
    </div>
    <div id="chat">
        <form method="post">
            <input type="textarea" placeholder="Enter Message..." id="usermsg" name="usermsg" autofocus>
            <input type="submit" value="Send" id="submitmsg" class="btn" name="submitmsg">
        </form>
    </div>
</div>
一切都做得很好,但我一直试图通过互联网找到如何制作我需要的自动滚动和自动更新的JQ功能,必须有一些间隔更新,请帮忙。

1 个答案:

答案 0 :(得分:1)

AJAX是您在不刷新页面的情况下即时提交表单和更改内容所需的内容。

相关问题