![](/img/trans.png)
[英]i was trying to create a command to remind members not to spam but i am having an error: TypeError: Cannot read property 'send' of undefined
[英]Am trying to create a web chat app when i send a message am having this error in console
我怀疑 forEach 行有问题。 请,我该怎么做 go 因为我的 PHP 代码运行良好,我的数据库交互是完美的,只是 JavaScript 功能显示我遇到问题的消息。 我已经移动了 renderMessage function 但没有变化
错误:
[Violation] 'setTimeout' handler took 6255ms
(index):30 Uncaught ReferenceError: renderMessage is not defined
at (index):30
at Array.forEach (<anonymous>)
at Object.success ((index):28)
at c (jquery-3.5.1.min.js:2)
at Object.fireWith [as resolveWith] (jquery-3.5.1.min.js:2)
at l (jquery-3.5.1.min.js:2)
at XMLHttpRequest.<anonymous> (jquery-3.5.1.min.js:2)
这是我的 index.php 代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Chat</title>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script >
var from = null, start=0, url='chat.php';
$(document).ready(function(){
from = prompt("please enter your name");
load();
$('form').submit(function (e){
$.post(url,{
message: $('#message').val(),
from: from
});
$('#message').val('');
return false;
})
});
function load(){
$.get(url + '?start=' + start, function(result){
if(result.items){
result.items.forEach(item=>{
start = item.id;
$('#messages').append(start, renderMessage(item));
});
$('#messages').animate({scrollTop: $('#messages')[0].scrollHeight});
}
load();
});
}
function renderMesssage(item){
let time = new Date(item.created);
time =`${time.getHours()}: ${time.getMinutes()< 10 ? '0': ''} ${time.getMinutes()}`;
return `<div class="msg"> <p> ${item.from} </p>${item.message}<span>${time} </span></div>`;
}
</script>
<style>
body{
margin:0;
overflow:hidden;
font-family: 'Lucida Sans','Lucida Sans Regular','Lucida Grande','Lucida Sans Unicode'
}
#messages{
height: 88vh;
overflow-x: hidden;
padding: 10px;
}
form{
display: flex;
}
input{
font-size: 1.2rem;
padding: 10px;
margin: 10px 5px;
appearance:none;
-webkit-appearance:none;
border: 1px solid #ccc;
border-radius: 5px;
}
#message{
flex: 2;
}
.msg{
background-color: #dcf8c6;
padding:5px 10px;
border-radius: 5px;
margin-bottom: 8px;
width: fit-content;
}
.msg p{
margin:0;
font-weight: bold;
}
.msg span{
margin-left: 15px;
font-size: 0.7rem;
}
</style>
</head>
<body>
<div id="messages"></div>
<form>
<input type="text" id="message" autocomplete="off" autofocus placeholder="type message..." >
<input type="submit" value="Send" >
</form>
</body>
</html>
处理数据库的chat.php
<?php
$db = new mysqli("localhost","root","","chat");
if($db->connect_error){
die("connection failed" .$db->connect_error );
}
$result=array();
$message=isset ($_POST['message']) ? $_POST['message'] : null;
$from=isset($_POST['from']) ? $_POST['from'] : null;
if(!empty($message) && !empty($from)){
$sql ="INSERT INTO `chat` (`message`, `from`) VALUES ('".$message. "', '".$from. "')";
$result['send_status']= $db->query($sql);
}
$start=isset($_GET['start']) ? intval($_GET['start']) : 0;
$items= $db->query("SELECT * from `chat` WHERE `id` > ".$start);
while($row=$items->fetch_assoc()){
$result['items'][]=$row;
}
$db->close();
header('Access-Control-Allow-Origin: *');
header('Content-Type: application/json');
echo json_encode($result);
?>
就这样
如果将 renderMessage 移到调用它的代码上方,它会改变什么吗? 此外,您在 function 的标题中出现了三个字符 s。 如果你纠正它,它可能会有所帮助。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.