Internet Explorer nicht die Darstellung von html zurück von JQuery ajax post

Ich habe eine Seite mit einem Eingabefeld, dessen onkeyup feuert eine JQuery ajax post, basierend auf, was eingegeben wurde (ein Suchfeld)

Den ajax-Aufruf zurück gebucht html soll, füllen Sie ein weiteres div-Element auf der Seite.

Hier ist die jquery-ajax-post:

var o = $(me.results).empty().addClass("aj3load");

$.ajax({
  type: "POST",
  dataType: "text",
  url: me.url,
  data: "cmd="+escape(me.cmd)+"&q="+q+"&"+me.args,
  cache: false,
  complete: function() {
    $(o).removeClass("aj3load");
    me.ls = q;
  },
  success: function(msg){
    $(ajax3.results)
      .html(msg)
      .find("div")
      .click(function(){
        var crs_id = $(this).find(":hidden").val();
        $(ajax3.field).val($(this).text());
        $(ajax3.vf).val(crs_id);
        $(ajax3.results).empty().slideUp("fast");
        ajax3.ls = $(this).text();
        getEventInfo();
      });
  }
});

Hier ist die Antwort des ajax-Aufrufs bei der Suche nach "eve" (pro Fiddler):

HTTP/1.1 200 OK
Cache-Control: private
Date: Thu, 03 Dec 2009 16:16:05 GMT
Content-Type: text/html
Server: Microsoft-IIS/6.0
X-Powered-By: ASP.NET
Vary: Accept-Encoding
Content-Length: 882

<div><input type="hidden" value="1000806" />111_Demo_Event_090924</div>
<div><input type="hidden" value="1000811" />123 Test Event oct 12 2009</div>
<div><input type="hidden" value="1000805" />AAA_Demo_Event</div>
<div><input type="hidden" value="1000103" />Developing Algebraic Thinking in Grades 3-5 - 30hr</div>
<div><input type="hidden" value="1000086" />Developing Algebraic Thinking in Grades K-2 - 30hr</div>
<div><input type="hidden" value="1000144" />Facilitating Oral Language Development (Grades PreK-3) - 30hr</div>
<div><input type="hidden" value="1000613" />Free PBS TeacherLine Event</div>
<div><input type="hidden" value="1000088" />Math in Everyday Life for Grades 6-8 - 15hr</div>
<div><input type="hidden" value="1000087" />Math in Everyday Life for Grades K-5 - 15hr</div>
<div><input type="hidden" value="1000163" />Using Multimedia to Develop Understanding - 30hr</div>

Nun in firefox und chrome alle diese divs zeigen, schön und gut, aber im IE wird nur das erste div wird angezeigt, in dem div-container auf die Seite.

Irgendeine Idee, was schief läuft mit dem IE hier?

UPDATE:
Wenn ich in einem alert("Hallo Welt"); nachdem ich zuweisen $(ajax3.Ergebnisse).html(msg)... rufen Sie IE machen die ajax-Beiträge Antwort richtig. Dies ist keine Lösung, nur evtl. etwas Hilfe bei der Fehlersuche. Ich will nicht, um eine alert-box Mitte der Verarbeitung. Auch ich habe festgestellt, dass dieses problem nicht beeinträchtigt IE 8, nur frühere Versionen.

Dank

Es wäre nützlich, wenn Sie zeigte den code in die callback aus deinem Ajax-request.
Kopiert habe ich deine divs in eine string-variable msg, dann lief $("#mydiv").html(msg); mit kein problem, die führt mich zu glauben, das problem ist mit einigen weiteren Teil der Seite. Sind Sie sicher, dass der AJAX-Aufruf gibt alle diese Ereignisse im IE? Sie könnten auch in Erwägung ziehen, mehr Informationen über die Seite, die in Ihrer Frage (andere Skripte, etc.).
Dank Jeff. Mit Fiddler konnte ich sehen, die ganze post zurück, mit dem Wert aus der ajax-Aufruf (die ich aufgelistet habe in meiner Frage). Ich bin nur wirklich ratlos, warum der IE zeigt nur das erste element zurückgegeben. Da funktioniert es in Firefox und Chrome ich nehme an, dass meine javascript-korrekt ist (weder ie noch firebug zeigt keine js Fehler).
Verwirrend in der Tat - alles, was ich empfehlen kann, ist zu pare wieder Ihr Skript, um die minimum-möglich und sehen Sie, ob Sie die Ursache einzugrenzen. Ich würde anfangen, durch das auskommentieren der complete Rückruf und der Teil des Codes fügt hinzu, dass die aj3load Klasse, wenn das blendet die div-und sehen, ob das hilft. Gestrahlt IE - bitte diese zu aktualisieren, wenn Sie es herausfinden!
Um dies zu beheben ich habe gerade die Ausgabe-Optionen in einer select-Liste.

InformationsquelleAutor Ryan | 2009-12-03

3

Es ist eine lange gedreht, aber was sind die Stile, die auf ajax3.Ergebnisse? Ist es möglich es hat eine Feste Höhe mit overflow:hidden? Oder Sie könnten auf ein rendering-bug...tun, die anderen Felder werden angezeigt, wenn Sie die Größe des Browsers (auslösen Neuzeichnen) nach dem Aufruf?
- Ah ha, wenn ich die Größe des Browsers den rest der erwarteten Ergebnisse zeigen. Die Stile, die hier angewendet werden: .aj3results { height: 95px; margin-bottom: 2px; padding: 2px; background: #fff; border: solid #000 1px; color: #000; overflow: auto; clear: both; display: none; } .aj3results div{ cursor:pointer; } .aj3results div:hover{ background-color: #CCCCCC; } Sorry für den code im Kommentar. Nicht fix aber Sie können etwas sein.
- Ok, ich Danke Ihnen sehr! Wenn ich kommentiere das overflow:auto; aus .aj3results Klasse es funktioniert! Aber ich brauche, um die Ergebnisse div eingeschränkt auf eine bestimmte Höhe und es sind Kinder divs enthalten, die mit der Möglichkeit zum Blättern durch Sie. Wenn ich overflow auf scroll bekomme ich die gleiche rendering-Probleme.
- Sie könnten versuchen, hinzufügen von zoom:1 zu Ihrem .aj3results Klasse und wiederherstellen von overflow:auto. Das könnte trigger a layout neu zeichnen.
InformationsquelleAutor Brother Erryn
3

Ihre input-tags nicht geschlossen sind. Dies kann dadurch manche Skurrilität im IE.
- Danke für die Anregung. Ich habe versucht, dem schließen der input-tags wie also <input /> und immer noch nicht die Darstellung im IE.
InformationsquelleAutor Bela
3

Ajax-Anfragen-Cache von IE. Mit Ihrem $.ajax deaktivieren der Zwischenspeicherung. Dies kann gerade eventuell ein weiterer Grund für das Problem.
- Hey sarfraz, danke für die Antwort. Ich hatte da Hinzugefügt, cache: false, um die ajax-post, aber ohne Erfolg. Ich bin Anfang zu denken, ich werde zu wiederholen, die ganze Seite w/o using jquery.
- kein problem , du willkommen 🙂
InformationsquelleAutor Sarfraz

Eine Sache, die ich tun würde, nicht verwenden divs. Ein besser geeignetes element wäre p. Ein ol wäre noch besser.

Geben Sie diese ein Schuss.

index.html:

<!doctype html>
<html>
<head>
    <meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
    <title>IE Ajax Test<title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    <script type="text/javascript">
        function doit() {
            $.get('php.php',
                    function(data) {
                        $('#t').html(data);
                    }
                 );
        }
    </script>
</head>
<body>
    <p>This is a paragraph.</p>
    <p id="t">This paragraph will be replaced.</p>
    <p><input type="button" value="Do it!" onclick="doit();" /></p>
</body>
</html>

php.php:

<?php
print("<p>text</p><p>text2</p><p>text3</p>");
?>

Danke für die Anregung. Versucht, es zu verwenden <p> - tags anstelle von <div> tags, aber der IE immer noch nur will, zeigt die erste zurückgegeben, <p> - element als auch. Dies ist, mich zu töten.

InformationsquelleAutor James Sumners

1

Überprüfen Sie Ihren Datentyp parameter in Ihrer Anfrage. Sie erwarten html, hinten, rechts? Versuchen Sie, dass zu "html".
- Versucht das auch. Immer noch kein Glück.
InformationsquelleAutor Jonathon Faust
0

Sagte Sie:

zurück rufen wird: function(msg){
$("mydiv").html(msg); } – Ryan

Fehlt das # - Zeichen vor mydiv? Versuchen Sie auch </input> zu sehen ist, verhält es sich anders als <input />.
- Vielen Dank für erwähnenswert, dass. Ich warf gerade in der "mydiv" als Platzhalter. Meine Entschuldigung. Es ist nichts falsch mit dem Selektor in meinem Skript, es funktioniert in Chrome und Firefox. Ich habe versucht, Ihren Vorschlag der Schließung der input-tag wie so <input></input> noch nicht im IE funktioniert.
- Ich habe versucht, die gleiche Sache, die Jeff versucht und es funktionierte auch für mich. Können Sie Fiddler oder einem debugger und stellen Sie sicher, dass das response-Objekt ist das, was Sie erwarten?
InformationsquelleAutor Jonathon Faust
0

Ich hatte diesen bug zu verwenden .html() nach ajax-Abfrage. Konnte es nicht auch Arbeit im IE6 noch 7 für die Liebe noch Geld, also bin ich einfach wieder auf .innerHTML. Funktioniert jetzt.

InformationsquelleAutor buggedcom
0

Bin ich auch mit dieser komischen bug. Es wurde behoben, sobald ich habe die doctype auf transitional aus strenge und Hinzugefügt
an den Anfang jeder ajax-response.

Bei anderer Gelegenheit merkte ich, dass der IE einfach nicht zu akzeptieren-tag in der ajax-Antwort. Wann auch immer Sie verwenden, um es zu finden, es auszog, meinen alle tags in der Antwort ließ nur Skelett-text

Tod zu IE.

InformationsquelleAutor Eastern Monk
0

Ich hatte das Problem mit den fehlenden modals auf meine JS erstellt modals auf meiner Rails-app.

Das einzige, was für mich gearbeitet wurde, entfernen alle fading-Effekt, da der Nachrichtentext der Antwort richtig war. (https://github.com/twbs/bootstrap/issues/3672)

In meiner rails-app (haml+booststrap), Ersetze ich die div-id:
"#modal-Fenster.modal.verstecken.fade"

pro

"#modal-Fenster.modal.ausblenden"

Es nicht nicht brechen, Chrome, Firefox, Safari und arbeitete auf Internet Explorer.

InformationsquelleAutor Paulo Henrique Lellis Gonalves

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.