简体   繁体   English

JavaScript在Ajax响应文件又称为chat.php中不起作用

[英]JavaScript doesn't work in ajax response file aka chat.php

I can't add any working JavaScript features in the chat.php. 我无法在chat.php中添加任何有效的JavaScript功能。 Basically I made a instant private messaging system with AJAX and JavaScript but the thing that sucks is that the chat.php show new messages constantly which is a good thing but prevents any JS to be executed that I put in chat.php. 基本上,我使用AJAX和JavaScript构建了一个即时私人消息传递系统,但令人讨厌的是chat.php不断显示新消息,这是一件好事,但是阻止了我放置在chat.php中的任何JS的执行。

chat.php works with php html css etc.. but not JS. chat.php与php html css等一起使用。但不适用于JS。 Keep in mind that I removed the JS that I wanted to put in chat.php. 请记住,我删除了要放入chat.php中的JS。

The posted code below works as it is design to do like show instant messaging but again if I add any JS features for example like something simple like document.write it doesn't work it seems like. 下面发布的代码可以正常工作,就像显示即时消息一样,但是如果我添加任何JS功能(例如像document.write这样简单的东西),它似乎也不起作用。

chat.php show it for a second or it just doesn't show any JS being executed I added. chat.php将其显示一秒钟,否则它不会显示我添加的任何JS。 So what can be the problem? 那么可能是什么问题呢? I just want to add working JS features in chat.php. 我只想在chat.php中添加可用的JS功能。 The JS works in the index.php area not targeted to chat.php. JS可以在index.php区域中工作,而不是针对chat.php。 But targeting to chat.php it gives the same results. 但是将其定位到chat.php可以得到相同的结果。

index.php index.php

<?php
include("0/instructions/php/session.php");
$session = $_POST['set_session'];
$session = $_SESSION['set_session'];
$messenger_id = $user_id;
$partner_id= $_POST['partner_id'];


?>
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width">
<meta charset="UTF-8">
<title>Chat System in PHP</title>
<link rel="stylesheet" href="style.css" media="all"/>
<script>
function ajax() {
var req = new XMLHttpRequest();
req.onreadystatechange = function(){
if(req.readyState == 4 && req.status == 200) {

document.getElementById('chat').innerHTML = req.responseText;

}
}
req.open('GET','chat.php',true);
req.send();

}
setInterval(function(){ajax()},1000);
</script>
</head>
<body onload="ajax();">
<div class="main_container">
<div id="container">
<div id="chat_box">
<div id="chat"></div>
</div>
</div>
<form method="POST" action="">
<div style="display: none;">
<input type="text" name="conversation_id" placeholder="conversation_id"  value="<?php echo $session; ?>"/>
<input type="text" name="member_name" placeholder="member_name" value="<?php echo $user_first_name;?> <?php echo $user_last_name;?>"/>
</div>
<textarea name="message" placeholder="enter message"></textarea>
<input type="submit" name="submit" value="Send it"/>
</form>
<?php
if(isset($_POST['submit'])){
$conversation_id = $_POST['conversation_id'];
$member_name= $_POST['member_name'];
$message= $_POST['message'];

$query = "INSERT INTO messages_x1 (conversation_id,member_name,message) values ('$conversation_id','$member_name','$message')";

$run = $connect->query($query);

if($run) {
echo "<div id='hide_audio'><embed loop='false' src='chat.mp3' hidden='true' autoplay='true'/></div>";
}

}
?>
</div>
</body>
</html>

chat.php chat.php

<?php
include("0/instructions/php/session.php");

$session = $_SESSION['set_session'];

$query= "SELECT * FROM messages_x1 WHERE conversation_id='$session' ORDER BY message_id DESC";
$run = $connect->query($query);

while($row = $run->fetch_array()) :
$messenger_id = $row['messenger_id'];
?>
<!DOCTYPE html>
<html>
<head>
<style>
.close_button {
    position: relative;
    float: right;
left: 8px;
    font-size: 25px;
    text-decoration: none;
  cursor:pointer;
bottom: 3px;
color: white;
background-color: transparent;
width: 30px;
height: 20px;
text-align: center;
}

.close_button p{
position: relative;
top: -15px;
}

.close_button:hover {
  color: red;
}
</style>
</head>
<body>
<div id="chat_data">
<span style="color:green;"><?php echo $row['member_name']; ?></span> :
<span style="color:brown;"> <?php echo  "<a class='close_button' href=\"delete.php?message_id=$row[message_id]\"onClick=\"return confirm('Are you sure you want to delete?')\">&times;</a>";?><br><?php echo $row['message']; ?></span>

</div>
<body>
</html>
<?php endwhile;?>

Screen Shot 屏幕截图

You shouldn't respond with a full blown html page to an AJAX request. 您不应该用完整的html页面来响应AJAX请求。 Just return a snippet to insert. 只需返回一个片段即可插入。 All the CSS and JavaScript should reside in the index.php and be called as needed. 所有CSS和JavaScript都应驻留在index.php中,并根据需要调用。 If you do need to pass JavaScript from your AJAX reply, you'll have to eval it to be executed. 如果确实需要通过AJAX答复传递JavaScript,则必须eval它才能执行。

Usually nowadays only JSON data is returned to AJAX calls. 通常,如今,只有JSON数据返回给AJAX调用。 Depending on how complex your JavaScript actions are this might actually make it easier to handle for you. 根据您的JavaScript操作的复杂程度,这实际上可能会使您更容易处理。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM