Menu

Sebastian Böthin

Softwareentwicklung

Internet Explorer und der „div“-Tag

Vor kurzem stand ich vor folgendem Szenario bei der Entwicklung mit ASP.NET MVC und JQuery:

Ich hatte eine Website erstellt, die dynamisch Inhalte vom Server nachgeladen hat. Gut, werden sich jetzt einige denken, das ist doch inzwischen Standard und sollte keine Probleme bereiten. Für gewöhnlich ist dies auch so, jedoch gab es hier eine Ausnahme: den Internet Explorer.

Man denke sich folgenden vereinfachten Quellcodeabschnitt:

<input type="text" onchange="$.get("/myController/Search",
   {query :  $(this).val()},
   function (resultValue)
   { $('#result_placeholder').html(resultValue); }  />
<div id="result_placeholder" />
<input type="submit" value="Suche starten" />

Mit eigenen Worten beschrieben: Gibt man etwas in das Textfeld ein, wird eine Anfrage mit dem Inhalt der Textbox an den Server gesendet und Resultate in das div mit der Id result_placeholder hineingeschrieben.

Das klappte auch wunderbar. Jedoch war daraufhin mein „Suche starten“-Knopf verschwunden und ich konnte mir nicht erklären warum. Durch eine Analyse des zur Laufzeit vorliegenden Quelltextes konnte ich dann auch sehen, dass mein Submit-Button tatsächlich nicht mehr vorhanden war. Es stellte sich mir also die Frage, wieso er im Internet Explorer verschwand und in allen anderen Browsern weiterhin vorhanden war.

Die Lösung des Ganzen ist relativ einfach. Anstatt <div id=“result_placeholder“ /> schreibt man <div id=“result_placeholder“></div> in den Quelltext, dann wird der Inhalt richtig gesetzt und auch der „Suche starten“-Button ist weiterhin vorhanden. :-)

Edit:

<!DOCTYPE html PUBLIC „-//W3C//DTD XHTML 1.0 Strict//EN“ „http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd„>
<html xmlns=“http://www.w3.org/1999/xhtml„>

Diesen DOCTYPE verwende ich bei dem oben genannten Problem. Laut W3C ist damit das Dokument als XHTML ausgezeichnet und mein „<div />“ standardmäßig erlaubt. In dem Zusammenhang ist auch meine Beobachtung zu betrachten.

Go Back