Javascript、Jquery、Cross browser issues、Frustration

Question

私は主にPHP開発者です。私は、この日には1つのスクリプト言語での専門化はそれをカットするわけではありませんが、JavaScriptとjQueryでの自分のスキルがかなり緑色であることは事実です。私は最高の初心者です。私自身のコードを作成することはできますが、Cross Browserの互換性はJavaScriptでの私の作業の大きな問題です。

とにかく、カテゴリ/サブカテゴリに従って商品をフィルタリングするスクリプトがあります。これはどのように動作するのですか：カテゴリを選択するとバックグラウンドのjavascriptがサブカテゴリをフィルタリングして、親カテゴリに関連するオプションを表示します。

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++; 
    } 
} 

このコードは、私が言う、かなり自明です：

は、ここに私のコードです。私はまた、新しいカテゴリが選択されるたびに、サブカテゴリで選択された現在のオプションからデフォルトのものにフォーカスをシフトするshiftfocus関数を持っています。

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

ShiftfocusのonChangeと呼ばれ、scategoriesがonClickの呼び出されます。これは基本的に、ここでのコードがあります。..サブカテゴリをリセットします。

問題1： 1）Firefox：Shiftキーを押しても、「選択済み」属性が追加されていても、フォーカスはデフォルトのオプションに変更されません。

2）Safari：まったく動作しません。

---

EDIT：問題2はケアレスミスの産物でした。私は であったアンカータグをIEに残しておいた。あなたを悩ます前にダブルチェックしてください。 みんな。ごめんなさい。問題1は依然として続きます。

---

問題2： 私は特に、インターネットエクスプローラのような私たちの開発者のどれもが理解していません。しかし、私はここで間違いを犯したと信じています。私はネイティブのPOST関数を介して別のファイルのスクリプトからデータを取り出し、id "content"を持つテーブルに追加するjQueryをいくつか持っています。これはIE以外のすべてのブラウザで正常に動作します。私がIE 7,8互換モードに戻ってみると、結果は少し良くなります（データは断片的に壊れています）。IE9互換モードでは何も追加されません！コードは次のとおりです。

$.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> 

助けてください。私はアラート、アラート（データ）でフェッチされた結果を出力しようとしましたが、スクリプトはすべてうまくフェッチしています。それだけで失敗する部分を追加する：|

Answer 1

ここにいくつかの提案があり、それらがやや役立つことを願っています。

問題：1 shiftfocus（）を特定の値に設定する代わりに、.val（ ''）を使用してクリアしてみましたか？私はこれが最初のオプションにデフォルト設定されると想像することができます。

問題：2 これは、サーバーから戻ってくるデータがわからないと、デバッグが難しくなります。レンダリングされた出力でフォーマットが正しくないか構文エラーが発生する可能性があります。