2011-02-03 8 views
0

シャドーボックスで開くはずのJavascriptでリンクのリストを生成しています。最初は、任意のページロード(Ctrl-F5など)で、リンクはシャドウボックスではなくウィンドウで開きます。私がシャドウボックス内で開けようとすることができれば、それは運が偶然やランダムに起こっても、ページが再び読み込まれるまで機能します。シャドウボックスがIEとFFで一貫して開かない

ここでは、ページ内のマークアップです:

<div id="portAgreementList"> 
    <ul id="blAgreements"></ul> 
</div> 

ここblAgreementsにリンクを作成するJavaScriptです:

function (data, status) 
{ 
    if (status == 'success') 
    { 
     if (data == '') 
     { 
      alert('URL returned no data.\r\n' + 
       'URL: ' + url); 
      return; 
     } 
     var jsonObj = StringToJSON(data); // StringToJSON function defined in /js/utilities.js 

     if (!jsonObj) { return; } 
     var items = ''; 

     if (jsonObj.items.length > 0) { 
      for (var xx = 0; xx < jsonObj.items.length; xx++) { 
       items += '<li><a rel="shadowbox;width=750;height=450;" href="' + jsonObj.items[xx].Url +'">' + 
       jsonObj.items[xx].Text +'</a></li>'; 
      } 
     } 
     else { 
      items = '<li>You have no port agreements on file for this company.</li>'; 
     } 
     $('#blAgreements').html(items); 
     Shadowbox.init(); 
    } 
} 

私はShadowbox.init(に呼んでいます)。私はリストアイテムの作成を追加した後、時々動作します。私が理解したいのは、なぜそれが矛盾しているのか、どうすればそれをより信頼できるものにするのかです。

更新#1:これは競合状態のようです。 IEで少なくともページを読み込んでクリックすると、最終的には動作します。 IE8では約3秒待たなければなりません。 FFはその行動に従わないようです。

更新#2: FFでは、ページが読み込まれた後にリンクをクリックすると、他のウェブページと同様にURLが開きます。戻るボタンを押してリンクをもう一度クリックすると、URLがシャドウボックスで開きます。

答えて

0

さらに掘り起こして解決策を見つけましたが、それでもなぜそれに問題があったのかを知りたいのですが。アンカーで

Shadowbox.setup($(anchor), null); 

function (data, status) 
{ 
    if (status == 'success') 
    { 
     if (data == '') 
     { 
      alert('URL returned no data.\r\n' + 
       'URL: ' + url); 
      return; 
     } 
     var jsonObj = StringToJSON(data); // StringToJSON function defined in /js/utilities.js 

     if (!jsonObj) { return; } 
     var items = ''; 

     if (jsonObj.items.length > 0) { 
      for (var xx = 0; xx < jsonObj.items.length; xx++) { 
       var li = $('<li></li>').appendTo('#blAgreements'); 
       var anchor = $('<a rel="shadowbox;width=750;height=450;" href="' + jsonObj.items[xx].Url +'">' + 
       jsonObj.items[xx].Text +'</a>').appendTo(li); 
       Shadowbox.setup($(anchor), null); 
      } 
     } 
     else { 
      items = '<li>You have no port agreements on file for this company.</li>'; 
     } 
    } 
} 

主な違い

は、私は要素

var li = $('<li></li>').appendTo('#blAgreements'); 
var anchor = $('<a rel="shadowbox;width=750;height=450;" href="' + jsonObj.items[xx].Url +'">' + jsonObj.items[xx].Text +'</a>').appendTo(li); 

としてDOMを構築し、その後、呼び出しだということです。

関連する問題