[JavaScript] Internet Explorer und jQuery Chat

Dieses Thema im Forum "Webentwicklung" wurde erstellt von Cubbi, 18. September 2009 .

Status des Themas:
Es sind keine weiteren Antworten möglich.
  1. 18. September 2009
    Internet Explorer und jQuery Chat

    Hallo,

    bin auf folgendes Script gestoßen:

    http://net.tutsplus.com/tutorials/javascript-ajax/how-to-create-a-simple-web-based-chat-application/

    Das ganze läuft auch prima mit allen vernünftigen Browsern (Firefox, Opera) allerdings nicht im Internet Explorer (Notebook 1, Vista, IE 7; Notebook 1, Vista, IE 8; Notebook 2, Vista, IE 7; PC, XP, IE8; Habe zusätzlich noch 2 verschiedene Webserver getestet).

    Hier geht es schon nach dem Login nicht mehr weiter. Es wird einfach die Seite erneut geladen und man steht wieder vor einem leeren Login-Feld.

    Habt ihr Ideen, woran das liegen könnte bzw. womit der IE nicht klar kommt ?

    Hier der Inhalt der index.php, enthält das wesentliche Script:

    PHP:
    <?
    session_start ();

    if(isset(
    $_GET [ 'logout' ])){    
        
        
    //Simple exit message
        
    $fp  fopen ( "log.html" 'a' );
        
    fwrite ( $fp "<div class='msgln'><i>User " $_SESSION [ 'name' ] . " has left the chat session.</i><br></div>" );
        
    fclose ( $fp );
        
        
    session_destroy ();
        
    header ( "Location: index.php" );  //Redirect the user
    }

    function 
    loginForm (){
        echo
    '
        <div id="loginform">
        <form action="index.php" method="post">
            <p>Please enter your name to continue:</p>
            <label for="name">Name:</label>
            <input type="text" name="name" id="name" />
            <input type="submit" name="enter" id="enter" value="Enter" />
        </form>
        </div>
        '
    ;
    }

    if(isset(
    $_POST [ 'enter' ])){
        if(
    $_POST [ 'name' ] !=  "" ){
            
    $_SESSION [ 'name' ] =  stripslashes ( htmlspecialchars ( $_POST [ 'name' ]));
        }
        else{
            echo 
    '<span class="error">Please type in a name</span>' ;
        }
    }
    ?>
    <!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>
    <title>Chat - Customer Module</title>
    <link type="text/css" rel="stylesheet" href="style.css" />
    </head>

    <?php
    if(!isset( $_SESSION [ 'name' ])){
        
    loginForm ();
    }
    else{
    ?>
    <div id="wrapper">
        <div id="menu">
            <p class="welcome">Welcome, <b><?php  echo  $_SESSION [ 'name' ];  ?></b></p>
            <p class="logout"><a id="exit" href="#">Exit Chat</a></p>
            <div style="clear:both"></div>
        </div>    
        <div id="chatbox"><?php
        
    if( file_exists ( "log.html" ) &&  filesize ( "log.html" ) >  0 ){
            
    $handle  fopen ( "log.html" "r" );
            
    $contents  fread ( $handle filesize ( "log.html" ));
            
    fclose ( $handle );
            
            echo 
    $contents ;
        }
        
    ?></div>
        
        <form name="message" action="">
            <input name="usermsg" type="text" id="usermsg" size="63" />
            <input name="submitmsg" type="submit"  id="submitmsg" value="Send" />
        </form>
    </div>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
    <script type="text/javascript">
    // jQuery Document
    $(document).ready(function(){
        //If user submits the form
        $("#submitmsg").click(function(){    
            var clientmsg = $("#usermsg").val();
            $.post("post.php", {text: clientmsg});                
            $("#usermsg").attr("value", "");
            return false;
        });
        
        //Load the file containing the chat log
        function loadLog(){        
            var oldscrollHeight = $("#chatbox").attr("scrollHeight") - 20;
            $.ajax({
                url: "log.html",
                cache: false,
                success: function(html){        
                    $("#chatbox").html(html); //Insert chat log into the #chatbox div                
                    var newscrollHeight = $("#chatbox").attr("scrollHeight") - 20;
                    if(newscrollHeight > oldscrollHeight){
                        $("#chatbox").animate({ scrollTop: newscrollHeight }, 'normal'); //Autoscroll to bottom of div
                    }                
                  },
            });
        }
        setInterval (loadLog, 2500);    //Reload file every 2.5 seconds
        
        //If user wants to end session
        $("#exit").click(function(){
            var exit = confirm("Are you sure you want to end the session?");
            if(exit==true){window.location = 'index.php?logout=true';}        
        });
    });
    </script>
    <?php
    }
    ?>
    </body>
    </html>
    Edit: Unter Safari klappt es wohl soweit, jedoch wird beim Drücken von Enter beim Senden einer Nachricht der Inhalt des Chatfensters "gelöscht" (log.html bleibt erhalten, nur der User sieht keinen Inhalt mehr). Klicken auf Senden klappt, ist also nich wirklich ein Problem, hilft aber eventuell bei der Fehlerbestimmung. Ich kenn mich leider mit java zu wenig aus, um da etwas zu finden :-(
     
  2. 18. September 2009
    AW: Internet Explorer und jQuery Chat

    Code:
    //Load the file containing the chat log
     function loadLog(){ 
     var oldscrollHeight = $("#chatbox").attr("scrollHeight") - 20;
     $.ajax({
     url: "log.html",
     cache: false,
     success: function(html){ 
     $("#chatbox").html(html); //Insert chat log into the #chatbox div 
     var newscrollHeight = $("#chatbox").attr("scrollHeight") - 20;
     if(newscrollHeight > oldscrollHeight){
     $("#chatbox").animate({ scrollTop: newscrollHeight }, 'normal'); //Autoscroll to bottom of div
     } 
     },
     });
     }
    siehste das "}," ?
    das komma muss weg

    IE8 sollte das aber mittlerweile ignorieren.
     
  3. 18. September 2009
    AW: Internet Explorer und jQuery Chat

    Leider macht er das anscheinend auch, beim Login springt der imernoch zum Login-Formular zurück

    Aber Danke für die schnelle Hilfe !

    Edit: Es klappt doch, jedoch nur, wenn man nicht Enter drückt sondern auf Senden klickt. Dafür gibts bestimmt einige Lösungen im Net - closed
     
  4. Video Script

    Videos zum Themenbereich

    * gefundene Videos auf YouTube, anhand der Überschrift.