Javascript, Jquery, Cross-Browser-Probleme, Frustration

Question

Ich bin ein überwiegend PHP-Entwickler. Mir ist klar, dass heutzutage die Spezialisierung in einer Skriptsprache es nicht schneidet, aber die Tatsache bleibt, dass meine Fähigkeiten bei JavaScript und jQuery ziemlich grün sind. Ich bin bestenfalls ein Neuling. Ich kann meinen eigenen Code erstellen, aber die Cross-Browser-Kompatibilität bleibt ein großes Problem mit meiner Arbeit in JavaScript.

Wie auch immer, ich habe ein Skript, das Produkte nach Kategorien/Unterkategorien filtert. So funktioniert es: Sie wählen eine Kategorie aus und das Javascript im Hintergrund filtert die Unterkategorien, so dass die angezeigten Optionen diejenigen sind, die zur übergeordneten Kategorie gehören - eine Kombination dieser beiden Filter der Produktlinie.

Hier ist mein Code:

function scategories(){ 

    //get the category option value from the category drop down bar 
    var cat = (document.getElementById('categories').value); 

    //get all the options from the subcategory drop down bar 
    var subcat = document.getElementsByClassName('subcategories'); 

    var n=0; 

    //if the category bar option is set to 0 display everything 
    if(Number(cat)==0){ 
     Show(); 
    } 

    //filter the subcategories 
    while(subcat.item(n)){ 

     //if there is no match b/w the subcategories option and the categories id FILTER 
     if(Number((subcat.item(n).value).split('|')[1]) != Number(cat) && Number(subcat.item(n).value) != 0){ 
      document.getElementsByClassName('subcategories') 
       .item(n) 
       .style 
       .display="none";  
     }else{ 

      //else display the subcategory 
      document.getElementsByClassName('subcategories') 
       .item(n) 
       .style 
       .display="list-item"; 
     } 
     n++; 
    } 
} 

Dieser Code ist ziemlich selbsterklärend, würde ich sagen. Ich habe auch eine Shiftfocus-Funktion, die den Fokus von der aktuellen Option, die in der Unterkategorie ausgewählt wurde, auf die Standardoption verschiebt, die bei der Auswahl einer neuen Kategorie "keine" ist. Dies setzt grundsätzlich die Unterkategorie .. hier ist der Code:

function shiftfocus(){ 
     document.getElementsByClassName('subcategories') 
      .item(0) 
      .removeAttribute("selected"); 
     document.getElementsByClassName('subcategories') 
      .item(0) 
      .setAttribute("selected","selected"); 
    } 

Shiftfocus heißt onChange und scategories wird onClick genannt.

Problem 1: 1) Firefox: Shiftfocus den Fokus auf die Standardoption nicht verschiebt, obwohl ich sehe, kann es die ‚ausgewählt‘ Attribut hinzu.

2) Safari: Funktioniert überhaupt nicht.

---

EDIT: Problem 2 war das Produkt eines Flüchtigkeitsfehler. Ich ließ eine Ankermarke offen, die war, die Chaos im IE verursacht. Sollten Sie sich vor dem Stören überprüfen lassen, Jungs. Es tut uns leid. Problem 1 besteht immer noch.

---

Problem 2: Ich verstehe, keiner von uns Entwickler besonders wie Internet Explorer. Aber ich bin bereit zu glauben, dass ich hier einen Fehler gemacht habe. Ich habe einige jQuery, die Daten aus einem Skript in einer anderen Datei über die systemeigene POST-Funktion abruft und es an eine Tabelle mit der ID "content" anfügt. Dies funktioniert in jedem Browser außer IE. Wenn ich versuche, in den IE 7,8-Kompatibilitätsmodus zurückzukehren, sind die Ergebnisse ein wenig besser (die Daten werden allerdings in Teilen angezeigt), und im IE9-Kompatibilitätsmodus wird überhaupt nichts angehängt! Hier ist der Code:

$.post("bagcontents.php", { 
    "Bid": $(this).attr('bid') 
}, 
function(data){ 
    $("#content").empty().append(data); 
    roundNumber(); 
    $('#processorder_hidden').attr('value',currentBid); 
}); 


//append here 
<div id="contents" style="overflow:auto;height:345px;padding-right:5px;"> 
    <form name="bag_contents" id="bag_contents" method="post" action="<?php _page ;?>"> 
     <table id="content"> 
     </table>   
     <input type="hidden" id="bag_contents_hidden" name="bag_contents_hidden" value="1" />  
    </form> 
</div> 

Jede Hilfe wird geschätzt. Ich habe versucht, die abgerufenen Ergebnisse mit Alarm, Alarm (Daten) auszugeben, und das Skript holt alles gut. Es ist nur der Append-Teil, der fehlschlägt: |

Answer 1

Hier sind einige Vorschläge und hoffen, dass Sie sie etwas nützlich finden.

Problem: 1 Anstatt den Wert für shiftfocus() auf einen bestimmten Wert zu setzen, haben Sie versucht, .val ('') zu verwenden, um es zu löschen. Ich kann mir vorstellen, dass dies die erste Option ist.

Problem: 2 Dies ist schwer zu debuggen, ohne zu wissen, welche Daten vom Server zurückkommen.Es könnte eine schlechte Formatierung oder ein Syntaxfehler bei der gerenderten Ausgabe sein.