Ajax Chat

BartTotal

Mitglied
Hallo mache grad einen Chat.

Bis jetzt geht alles mit php
nun wollte ich fragen wie ich möglichst einfach statt mit reload die inhalte anzeigen kann.
Beim Reload kann ich keinen Chat ton einfügen.

Könnt ihr mir helfen, dass jeder neue chattext einen tonauslöst?
 
Es gibt etliche Tutorials dafür, Stichwort: Ajax chat. Einfach mal danach googlen.

Wenn du danach eine konkrete Frage zu einem bestimmten Beispiel hast können wir dir helfen.
So wie du die Frage jetzt stellst ist sie aber viel zu allgemein und kann nicht beantwortet werden.
 
Hab bereits nach Tutorials gesucht aber die bieten meist komplexe chats was für mich zu kompliziert ist.

Hab jetzt mal ein formular das den namen und den text in eine datenbank speichert
für den chatverlauf habe ich diesen code:

Javascript:
<script type="text/javascript">
     $(document).ready(function() {
       $("#chat").load("chat.php");
       var refreshId = setInterval(function() {
          $("#chat").load(\'index.php?page=41?\' + 1*new Date());
       }, 500);
    });
</script>
  
<div id="chat" style="text-align:left;"><center>Ladet...</center></div>
';

nun möchte ich das wenn jemand was schreibt ein ton abgespielt wird. Sodass wenn jemand im chat ist jedoch in einem anderen Browser-Tab trotzdem merkt das geschrieben wird.
 
Das Problem bei deinem Code ist, dass du einfach .load() auf das Element anwendest und somit nicht weisst ob was neues dazu gekommen ist.

Sound abspielen würde etwa so gehen (In diesem Beispiel wird aber jedesmal wenn die Antwort da ist, unabhängig davon ob eine neue Nachricht da ist, ein Sound abgespielt):
Javascript:
<script type="text/javascript">
     $(document).ready(function() {
       $("#chat").load("chat.php");
       var refreshId = setInterval(function() {
          $("#chat").load(\'index.php?page=41?\' + 1*new Date(), function() {
            document.getElementsByTagName("audio")[0].play();
          });
      }, 500);
   });
</script>
<div id="chat" style="text-align:left;"><center>Ladet...</center></div>
<audio>
    <source src="sound.mp3">
</audio>

Um nun zu erkennen ob sich was geändert hast musst du irgendwie erkennen ob sich seit dem letzen mal was geändert hat. Pseudocode mässig in etwa:
Javascript:
<script type="text/javascript">
     $(document).ready(function() {
       $("#chat").load("chat.php");
       var refreshId = setInterval(function() {
            var chat = $("#chat").html(); //Content vor dem laden zwischenspeichern
          $("#chat").load(\'index.php?page=41?\' + 1*new Date(), function() {
            if($("#chat").html() != chat) //Und nach dem laden vergleichen.
                document.getElementsByTagName("audio")[0].play();
          });
      }, 500);
   });
</script>
<div id="chat" style="text-align:left;"><center>Ladet...</center></div>
<audio>
    <source src="sound.mp3">
</audio>
 
:D geht super.

nun habe ich eine anzeige die mir sagt wie alt der chat text ist:

BartTotal: Hallo
Vor 5sek

das lädt nun und lässt desshalb jedesmal den ton abspielen weil die sekunden sich verändern.
Kann ich das ihrendwie ausschliessen lassen? Sodass es zwar die sekunden hochzählt aber nicht jedesmal den ton abspielt.
 
Wenn ich dich richtig verstehe, möchtest Du das PHP-Skript unter der URL, die Du da gepostet hast, ausführen, ohne die Seite neu zu laden. Die Lösung hast Du doch im Titel dieses Threads: Das kannst Du mit Ajax.
 

Neue Beiträge

Zurück