Warum stürzt onChange den Internet Explorer 7 ab?

Question

Wir haben gerade einen Online-Shop eröffnet.

Auf dieser Seite stürzen die Auswahlboxen im Internet Explorer 7 auf einigen Computern ab. Auf meinem Computer nie. Weiß jemand, warum?

Live-Link: http://velour.se/collection/women/tops/eloise Update: Es hat sich herausgestellt, dass die erste Version, die ich gepostet habe, nicht abgestürzt ist. Aber das folgende schon: http://velour.se/collection/women/outerwear/irina

Screendump: http://skitch.com/jesperlind/nc4j2/tops-eloise-velour-ie7-bug

Originalfassung:

<select id="sizeDD" onchange="javascript:SizeChange(this);"></select>

//Internet Explorer problem.
function SizeChange(e){
    DrawAmountDD(GetAmountById(e.value));
}

Hier ist ein Teil des Codes, von dem ich denke, dass er betroffen sein könnte:

    function DrawAmountDD(maxAmount){
        /*var max = parseInt(maxAmount) > parseInt(maxShowAmount) ? maxShowAmount : maxAmount;
        var html = "";
        for(var i=1; i <= max; i++){
            html += "<option value='" + i + "'>" + i + "</option>";
        }
        $("#amountDD").html(html);*/

        var max = parseInt(maxAmount) > parseInt(maxShowAmount) ? maxShowAmount : maxAmount;
        var ddlAmount = document.getElementById("amountDD");
        ddlAmount.length=max;

        for(var a=1; a <= max; a++){
            ddlAmount.options[a-1].value = a;
            ddlAmount.options[a-1].text = a;
        }
    }

Version 2:

<select id="sizeDD"></select>
<select id="amountDD"></select>

<script type="text/javascript">
    var maxShowAmount = '5';
    var colorSizeArr =
      { "colSize":
        [
            { "color": "Black/Offwhite",
              "specificId": "2",
              "size": "XS",
              "amount": "1" }
        ]
      };

    colorSizeArr.colSize.push(
      { "color": "Black/Offwhite",
        "specificId": "13",
        "size": "S",
        "amount": "2" });

    $(document).ready(function () {
        var selectSizeDD = document.getElementById('sizeDD');
        selectSizeDD.onchange = function () { sizeChange(selectSizeDD); };
    });

    function sizeChange(e) {
        DrawAmountDD(GetAmountById(e.value));
    }

    function GetAmountById(specificId) {
        for (var i = 0; i < colorSizeArr.colSize.length; i++) {
            if (colorSizeArr.colSize[i].specificId == specificId) {
                return colorSizeArr.colSize[i].amount;
            }
        }
        return 1;
    }

    function DrawAmountDD(maxAmount) {
        var max = parseInt(maxAmount) > parseInt(maxShowAmount) ? maxShowAmount : maxAmount;
        var html = "";
        for (var i = 1; i <= max; i++) {
            html += "<option value='" + i + "'>" + i + "</option>";
        }
        $("#amountDD").html(html);

    }
</script>

Update

Ich habe noch nicht herausgefunden, warum der Internet Explorer 7 auf einigen Computern abstürzt. Jedenfalls hatte der obige Code nichts damit zu tun. Es war viel einfacher. Der Browser stürzte ab, wenn ich auf ein Auswahlfeld mit nur einer Option klickte. Etwa so:

<select id="amountDD">
<option value="1">1</option>
</select>

Ich fand einige Informationen auf diesen Link, wo es sagt, dass die einzelne Option ein ausgewähltes Attribut sowie haben sollte, aber es scheint für uns ohne das Attribut zum Absturz bringen.

http://www.akselvoll.net/2007/08/ie7-crashes-when-clicking-on-drop-down.html

Answer 1

Erstens ist es nicht notwendig, die javascript: Vorwahl in Ihrem Aufschlag. Der Handler geht davon aus, dass es sich um Javascript-Code handelt, und ich bin überrascht, dass einige Browser ihn tatsächlich analysieren. In der Regel sehen Sie es als Protokoll-Tag in einer href Attribut, und selbst das ist keine gute Lösung. Zweitens ist der Parameter der Funktion ein Verweis auf das DOM-Element (select), dessen value-Attribut möglicherweise nicht gut unterstützt wird. Es gibt eine gute Referenz für HTML/Javascript DOM unter http://www.w3schools.com . Siehe die Wählen Sie Referenz dort. Um den Wert zu erhalten, können Sie Folgendes tun e.options[e.selectedIndex].value . Drittens wäre es wahrscheinlich rundum besser, den Handler per Javascript hinzuzufügen.

var select = document.getElementById( 'sizeDD' );
select.onchange = function() { sizeChange(select); };

Oder da ich jetzt sehe, dass Sie jQuery verwenden:

$('sizeDD').change( sizeChange );

Answer 2

Ich hoffe, mit "Absturz" meinen Sie "das JavaScript funktioniert nicht", nicht "Internet Explorer stürzt ab". Wenn es nur die Seite ist, können Sie den Fehler normalerweise sehen, indem Sie in der Statusleiste auf "Fehler auf der Seite" klicken.
Versuchen Sie es auch mit klassischem JavaScript-Debugging - kommentieren Sie Blöcke der Funktion aus, einen nach dem anderen, bis Sie den Block finden, der sie zum Absturz bringt, und grenzen Sie ihn dann auf die Zeile ein.

Answer 3

Ich werde diese Frage so gut ich kann selbst beantworten. Wenn jemand eine ausführlichere Antwort hat, fügen Sie sie bitte hinzu, und ich werde sie als akzeptiert markieren.

Der Internet Explorer 7 scheint unter bestimmten Umständen aufgrund eines Fehlers im Browser oder im System abzustürzen. Die Geräte, mit denen wir Probleme hatten, waren von HP und liefen unter Vista. Vielleicht hatte der Verkäufer etwas installiert, das den Browser störte, wie das hier beschriebene "Sign On on my HP ProtectTools Security": http://social.msdn.microsoft.com/Forums/en/iewebdevelopment/thread/63216546-9289-4345-898c-860d02db7357

Andere Möglichkeiten werden hier beschrieben: http://www.akselvoll.net/2007/08/ie7-crashes-when-clicking-on-drop-down.html

Eine einfache Lösung besteht darin, den Internet Explorer auf Version 8 zu aktualisieren.