我编写了一个非常简单的聊天脚本,该脚本使用 AJAX 插入数据以避免页面刷新。数据插入,但我需要刷新页面才能看到插入的数据。我使用jQuery来避免页面刷新。有人可以帮忙吗?
脚本
$("#submit").click( function() {
$.post( $("#chatForm").attr("action"),
$("#chatForm :input").serializeArray(),
function(info){ $("#result").html(info);
});
clearInput();
});
$("#chatForm").submit( function() {
return false;
});
function clearInput() {
$("#chatForm :input").each( function() {
$(this).val('');
});
}
形式.php
<form id="chatForm" action="chat.php" method="post">
<input id='message' name="message" type="text" class="form form-control messageBar" placeholder="Write message here..."/>
<input id='employee_id' name='employee_id' type="hidden" value="<?=$session_myemployeeid;?>">
<div class='col-md-2 pull-right'>
<button id="submit">Send Comment</button>
</div>
</form>
聊天.php
<?php
include '../includes/config.php';
// set parameters and execute
$employee_id = $_POST['employee_id'];
$message= $_POST['message'];
// prepare and bind
$insertchat= $db->prepare("INSERT INTO companychatroom (employee_id,message) VALUES (?, ?)");
$insertchat->bind_param("is",$employee_id,$message);
$insertchat->execute() or die(mysqli_error($db));
$insertchat->close();
$db->close();
显示.php
<div id="displayMessage" class="displayMessage">
<?php
$sqlchat="SELECT * FROM companychatroom
JOIN employees
ON companychatroom.employee_id=employees.employee_id";
$resultchat= mysqli_query($db,$sqlchat);
while($chat=mysqli_fetch_array($resultchat)){ ?>
<div class="row" style="padding:4%;">
<p><?=$chat['first_name'];?> <?=$chat['last_name'];?></p> <div class="bubble"><?=$chat['message'];?></div>
</div>
<?php };?>
</div>
好的 让我们把这个放在一起做一个答案:
修改 .POST 成功功能将结果移动到页面中:
$("#submit").click( function() {
$.post( $("#chatForm").attr("action"),
$("#chatForm :input").serializeArray(),
function(info){ $("#displayMessage").html(info);
});
clearInput();
});
修改聊天.php生成标记
<?php
include '../includes/config.php';
// set parameters and execute
$employee_id = $_POST['employee_id'];
$message= $_POST['message'];
// prepare and bind
$insertchat= $db->prepare("INSERT INTO companychatroom (employee_id,message) VALUES (?, ?)");
$insertchat->bind_param("is",$employee_id,$message);
$insertchat->execute() or die(mysqli_error($db));
$insertchat->close();
$sqlchat="SELECT * FROM companychatroom
JOIN employees
ON companychatroom.employee_id=employees.employee_id";
$resultchat= mysqli_query($db,$sqlchat);
$result = '';
while($chat=mysqli_fetch_array($resultchat)){
$result .= '<div class="row" style="padding:4%;">';
$result .= '<p>';
$result .= $chat['first_name'].' '.$chat['last_name'];
$result .= '</p> <div class="bubble">';
$result .= $chat['message'];
$result .= '</div></div>';
}
echo $result;
$db->close();
将显示.php更改为
<div id="displayMessage" class="displayMessage"></div>
免责声明 - 这是未经测试的,但应用所展示的原则应该适合您。