无法在聊天网站上的每条新消息上添加声音提醒

时间:2017-01-19 13:24:41

标签: javascript php html mysql ajax

我正在建立一个聊天网站,我想在发送新消息时添加声音警报,这样我就可以提醒其他用户新的未读消息(我使用MySQL存储消息等)。我使用ajax从数据库中获取消息并将它们放在我的聊天室中。我尝试过各种各样的方式,但它并没有在每条新消息上单独工作。请帮忙!

这是我的index.php

<?php
session_start ();
define('DB_HOST', 'localhost');
define('DB_NAME', '*******');
define('DB_USER','*****');
define('DB_PASSWORD','********');
?>
<!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>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<META HTTP-EQUIV="content-type" CONTENT= "text/html; charset=UTF-8"> 
<link rel="stylesheet" type="text/css" href="style.css">
<title>Chat2Chat!</title>
</head>
<body id="body-color">
<?php
	if (! isset ( $_SESSION ['user'] )) {
			header ( "Location: sign-in.html" ); // Redirect the user
	} else {
		?>
<div id="wrapper">
		<div id="menu">
			<p class="welcome">
				Καλωσήρθες, <b><?php echo $_SESSION['user']; ?></b>
			</p>
			<p class="logout">
				<b class="submitmsg" id="exit" href="#">Logout</b>
			</p>
			<div style="clear: both"></div>
		</div>
		<div id="chatbox" class="chatbox">
		
		</div>
		<form name="message" action="">
			<input name="usermsg" type="text" id="usermsg" size="63" autofocus/> 
			<input class="submitmsg" name="submitmsg" type="submit" id="submitmsg" value="Αποστολή"/>
		</form>
	</div>
	<script type="text/javascript"
		src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
	<script type="text/javascript">
// jQuery Document
$(document).ready(function(){
	setInterval ( "get()", 2000 );
});

//jQuery Document
$(document).ready(function(){
	//If user wants to end session
	$("#exit").click(function(){
		var exit = confirm("Είσαι σίγουρος πως θέλεις να αποσυνδεθείς;");
		if(exit==true){window.location = 'index.php?logout=true';}		
	});
});

//If user submits the form
$("#submitmsg").click(function(){
		var clientmsg = $("#usermsg").val();
		$.post("post.php", {text: clientmsg});				
		$("#usermsg").attr("value", "");
		loadLog;
	return false;
});
setInterval (loadLog, 2500);

	function get(){
     $.ajax({
       type: 'GET',
       url: 'chat.php',
       success: function(data){
        $("#chatbox").html(data);
		var scroll = document.getElementById('chatbox');
		scroll.scrollTop = scroll.scrollHeight;
       }
     });
 }
</script>
<?php
	}
	?>
	<script type="text/javascript"
		src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
	<script type="text/javascript">
</script>
</body>
</html>

chat.php

<!DOCTYPE HTML>
<head>
<title>Chat</title>
<META HTTP-EQUIV="content-type" CONTENT= "text/html; charset=UTF-8">
</head>
<?php
define('DB_HOST', 'localhost');
define('DB_NAME', 'db_57218');
define('DB_USER','u57218');
define('DB_PASSWORD','27222528');
$con = mysqli_connect(DB_HOST,DB_USER,DB_PASSWORD,DB_NAME) or die("Failed to connect to MySQL: " . mysqli_error());	

$query = "SELECT * FROM Messages";
if($result = mysqli_query ($con, $query)){
	while ($row = mysqli_fetch_row($result))
	{if($row['4']==0){
		echo '('.$row['5'].') <b>'.$row['1'].'</b>: '.$row['2'].'<br>';
	}
	else{echo 'Ο χρήστης <b>'.$row['1'].'</b> '.$row['2'].'<br>';}
	}
	mysqli_free_result($result);
}
mysqli_close($con);
?>

1 个答案:

答案 0 :(得分:0)

您可以存储您播放的最后一条消息ID,并且在每次刷新操作时,您都可以检查上一条消息ID是否等于您之前存储的ID。如果没有,你就播放声音。

更清楚:

$lastMessageId=5;
$lastMessageIdWePlayedSoundFor=4;

if($lastMessageId!=$lastMessageIdWePlayedSoundFor)
{
   ////play sound here 
   $lastMessageIdWePlayedSoundFor=$lastMessageId;
}

因此,每当有新消息我们都没有发出声音时,我们就会发出声音。您可以使用此算法。