0

ユーザーが検索基準を入力できるようにする Web アプリケーションがあり、検索基準の入力フィールドのすぐ下にあるポートレット コンテナーに結果が追加されます (上記)。環境 - JSP、JAVA、および TAG ライブラリ 検索ページは基本的に、無数のタグ ライブラリを参照するいくつかの JSP ページで構成されています。

検索結果が返された後 (AJAX) - ポートレット iframe は、新しい高さに基づいてサイズ変更する必要があります。呼び出される JavaScript メソッド (タグ ライブラリの 1 つに常駐)setContainerHeightが、このサイズ変更を行います。

問題 -

Internet Explorer は、このサイズ変更を行う私の JS メソッドを呼び出しません!

次の記事がこの問題の解決に役立つと思います。 Javascript IE イベント

Chrome、Firefox、Opera....すべて対応しています。

ページを更新するように明示的に指示することはできません (検索条件パラメーターが失われます)。また、リクエストを行っているブラウザーの種類を明示的に確認することもできません (JavaScript が呼び出されていません)。コールバックの後にサイズ変更メソッドを呼び出すようにページに明示的に指示するにはどうすればよいですか?

誰かが興味を持っている場合-これは私のサイズ変更方法です:

function setContainerHeight() {
  //reset the height to shrink the scroll height for the usecase where the portlet's contents got smaller.

  getPortlet().style.height = '${frameHeight}px';
  getPortlet().height = '${frameHeight}px';

  try {
     height = getFrameHeight(getPortlet());
  } catch (e) {
    //fallback for crossdomain permission problems.
    height = '${frameHeight}';
  }

  //set the portlet & portlet container to be the same height - not using 100% for the portlet to avoid the inner scrollbar
  try {
    getPortletContainer().style.height = height + 'px';
  } catch ( ex ) {
      // do nothing, we can't get to the container
  }
  getPortlet().style.height = (height + getHorScrollBarHeight()) + 'px';
  getPortlet().height = (height + getHorScrollBarHeight()) + 'px';
}

そして、これはこのメソッドを呼び出すコードのセクションです -

/* resizes the portlet container to fit the size of the porlet. */
function resizePortletContainer() {

  if (hasContainerHeightChanged()) {
    saveScrollPosition();
    setContainerHeight();
    restoreScrollPosition();
  }

  //width handling needs some work
  //if (hasContainerWidthChanged()) {
    //setContainerWidth();
  //}
}

//registering event handlers...
var frame = getPortlet();
var prevPortletLoadEvent = frame.onload ? frame.onload : function () {};
frame.onload = function () {prevPortletLoadEvent(); resizePortletContainer(); };

var prevPortletResizeEvent = frame.onresize ? frame.onresize : function () {};
var onresize = function () {prevPortletResizeEvent(); resizePortletContainer(); };

もう少し情報 -
上記の登録イベント ハンドラー コードの後に​​アラート ステートメントを配置した後。IE と Firefox の両方が、コードのこの部分を 1 回だけ呼び出していることに気付きました (どちらの場合も、最初の検索画面がブラウザーに表示されたときにアラート ボックスが 1 回だけトリガーされました)。 Firefox は、イベントを登録するために使用している上記のコードを気に入っています。IE は、このイベントを登録する別の方法を探しているのでしょうか?

次の投稿は、この問題に対する答えを探すのに役立つと思います --

Javascript IE イベント

4

1 に答える 1

0

別の投稿で答えを見つけましたが、基本的に問題は、Internet Explorer が他のすべてのブラウザーとは異なる方法で iframe イベントを登録することでした。
また、あなたが見るための良い投稿 - onload と addEventListener('load') の iframe の動作

問題を修正するために使用したコードを以下に示します。これが、私が抱えていた同様の問題に陥った他の誰かに役立つことを願っています。

どのブラウザーがリクエストを行っているかを簡単に確認する必要がありました。以下に示す 2 つの条件付きブロックは、IE の構文が異なることを除いて、同じことを行います。さすがIE。笑。

//Microsoft Internet Explorer Browser - iFrame event register
if (navigator.appName.indexOf("Microsoft") != -1) {
  var frame = getPortlet();
  var prevPortletLoadEvent = frame.onload ? frame.onload : function () {};
  var refresh = function() { prevPortletLoadEvent(); resizePortletContainer(); };

  if(frame.attachEvent) frame.attachEvent('onload', refresh);
  else frame.addEventListener('load', refresh, false);
}

//All other major browsers - iFrame event register
else {
  var frame = getPortlet();
  var prevPortletLoadEvent = frame.onload ? frame.onload : function () {};
  frame.onload = function () {prevPortletLoadEvent(); resizePortletContainer(); };

  var prevPortletResizeEvent = frame.onresize ? frame.onresize : function () {};
  var onresize = function () {prevPortletResizeEvent(); resizePortletContainer(); };
}
于 2012-07-03T17:37:21.783 に答える