1

私はほとんどのプログラミングの初心者なので、無知を許してください。

JQueryタブ内でJQueryアコーディオンを使用しています。このページはFirefoxv12とIEv9で正常に動作しますが、Chrome / Iron v12では機能しません。具体的には、クラブ名をクリックしてクラブの統計を取得すると、タブが垂直に表示され、アコーディオンが混乱します。

ページは次のとおりです。http ://www.footballfanweb.com/ffwfootballstats/getclubs

「プレミアリーグ」をクリックしてからクラブ名をクリックすると、サイトは下部のタブ領域にいくつかの統計を配信します。

私は最初にこれを使用してロードします:

$(document).ready(function() {

    $("#accordion").accordion({
        collapsible: true,
        active: 4
    });   

    $(function() {
        $( "#tabs" ).tabs();
    });

//  Populate the accordion with football teams for each of the divisions

    $.ajaxCall('myajaxclass.listclubs','div_id=1');
    $.ajaxCall('myajaxclass.listclubs','div_id=2');
    $.ajaxCall('myajaxclass.listclubs','div_id=3');
    $.ajaxCall('myajaxclass.listclubs','div_id=4');

}); /* end document ready */

上記のajax呼び出しは、パネルにサッカーチームの名前を入力し、次のようなリンクのリストとして書き込みます。

while($row=mysql_fetch_assoc($result)){        
  $club = $row['club_name'];
  $divstring.='<li title=\"' . $club . '\"><a href=\"#\" >' . $club . '</a></li>'; 
}

これにより、クラブのリストが作成されます。

ajax呼び出しを使用して統計を取得し、次に下部のアコーディオンをアクティブにして、統計が次のように表示されるようにします。

 $("li[title]").live('click', function() {

        var selectedclub = $(this).attr('title');

        $.ajaxCall('myajxclass.getclubinfo', 'theclub=' + selectedclub );       
        $.ajaxCall('myajxclass.statssum','theclub=' + selectedclub );

        $("#accordion").accordion( 'activate' , 4);


    $(function() {
             $( "#tabs" ).tabs();
           });

    });

私はこの問題の周りにたくさんのスレッドを検索しました。1つの提案は、ajax呼び出しから戻ったときにtabs関数を呼び出すことでした。私はさまざまなアプローチを試しました、例えば

$('#tabs').tabs('select', 0); // zero-based, i.e. 1 = tab 2

$("#accordion").accordion( 'activate' , 4);

$('#tabs').tabs('select', 0); 

しかし問題を解決しませんでした:(

htmlは次のようになります。

<div id="tabs">

   <ul>
     <li> flag image 1</li> 
     <li> flag image 2</li>
      ... 
   </ul>

   <div id="tabs-1">

      <div id="accordion">
         // data etc in here.
      </div>

   </div>

   <div id="tabs-2">
        <p> Italy ... Coming soon</p>
    </div>
    ....
</div>

Chromeで無効なHTMLに問題があるのではないかと思ったので、w3.orgバリデーターでページを検証しましたが、重要ではない、関連のない2つのエラーがあります。

「必須属性「alt」が指定されていません」「属性「target」がありません」

FFfirebugにはエラーはありません。

誰か提案はありますか?

フィードバックをありがとう!

トニー

4

0 に答える 0