2011-11-11 10 views
1

したがって、動的に生成されたコンテンツのscrollHeightを調べて、コンテンツに他のボタンを含めるかどうかを判断しています。ユーザーは、[詳細]ボタンをクリックしてコンテンツを展開し、内容をすべて見ることができます。しかし、たまに同じ関数を使うと、要素のscrollHeightが0であることは言うまでもありませんが、言うまでもありませんが、これらの要素の関数を破壊します。私は、この関数が時間の90%で動作する理由についてはうんざりしていますが、明らかに要素がscrollHeightを持たない(ページ上のスペースを占める)と言うことがあります。ここで 時々0を返す要素のscrollHeightを確認する

は関数である。

function hide_show_expand_button(length){ 
    var current_div = ''; 
    var current_span = ''; 
    //console.log(length); 
    for(var i = 0; i < length; i++){ 
     if(document.getElementById("message_span"+i)){ 
      current_div = document.getElementById("items_content"+i); 
      current_span = document.getElementById("message_span"+i); 
      console.log(current_div.scrollHeight, "height of the div") 
      if(current_span.scrollHeight > 128 && current_div.scrollHeight < 170){ 
       console.log("inside of the check for the conversation screen"); 
       current_div.innerHTML +="<a href=\"#\" id='expand_colapse_button"+i+"' class=\"expand_colapse_button_conversation\" style=\"color:blue;\" onclick='expand_colapse(\""+ i + "\")'>More...</a>"; 
      } else if(current_span.scrollHeight > 128 && document.getElementById("items_content"+i).scrollHeight > 200){ 
       current_div.innerHTML+="<a href=\"#\" id='expand_colapse_button"+i+"' class=\"expand_colapse_button_attatchment\" style=\"color:blue;\" onclick='expand_colapse(\""+ i + "\")'>More...</a>"; 
      } else if(current_span.scrollHeight > 128 && current_div.scrollHeight < 200){ 
       current_div.innerHTML +="<a href=\"#\" id='expand_colapse_button"+i+"' class=\"expand_colapse_button\" style=\"color:blue;\" onclick='expand_colapse(\""+ i + "\")'>More...</a>"; 
      } 
     } 
    } 
} 

あなたは私が生成されている細胞の異なる種類のカップルを持っているので、私はスパンとdivの上scrollHeightをチェックしています見ることができるように、私がする必要はありセルのタイプに応じて異なる場所に多くのボタンを配置します。この関数は、チェックされているコンテンツを生成する関数の最後でのみ呼び出され、完全に作成される前にこの関数を実行していたという微妙な機会にsetTimeout()呼び出しで試してみました(私は起こるだろうが誰が知っているか)。

P.S.これはすべてクロム・エクステンションの内部で行われます。私はそれがそれと何か関係があるとは思わないが、誰が知っている。また、scrollHeightの問題について投稿した人がposition: absoluteで投稿したのと同様に、要素の位置は相対的です。

編集、より具体的にする:

うまくいけば、これは私が測定しようとしている細胞はどれも、いくつかの異なる方法にその表示セットを取得します含むdivの中にある、役立ちます。上で起こっていることは、コンテナからナビゲートして(表示をnoneに設定した)インスタンスの1つで発生し、次にそれに戻ってナビゲートします(表示をブロックに設定します)。あなたはクロム・エクステンションの中で約十数個の方法でこれを行うことができます。しかし、スクロールHeightを持たない(つまり、getBoundingClientRect()を使用しようとしたときに高さがあり、すべてが0になった)という理由だけで、私は混乱しています。

また、セルを構築するために、関数の最後にscrollHeightを呼び出す関数を呼び出すために、上に述べたように、セルが再構築されるように、ナビゲーションに戻ることがあります。したがって、コンテナに戻るたびに、私の関数も呼び出されます。

私は(私はChromeの同様のリンクを見つけることができませんでした)これらを見てお勧めします

答えて

1

私は問題を理解しました。それは、異なる要素が表示されないように設定された後に、私がチェックしようとしていたものと関連していました。何らかの理由で5〜8個のセルがある場合は、ページ上ではなく他のコンテンツをチェックしてから、現在のコンテンツに切り替えていました。いくつかのIDを変更すると、最終的に私はそれを修正させます。

0

MSDN:http://msdn.microsoft.com/en-us/library/ms530302%28v=VS.85%29.aspx

MOZ:https://developer.mozilla.org/en/Determining_the_dimensions_of_elements

何かあればscrollHeightにのみ有効であると思われますスクロールするのに十分な大きさなので、0はスクロールが不要(すべてのコンテンツが表示されていること)を意味すると仮定します。上記のリンクを見て、あなたが望むのはおそらくclientHeightです。

+0

オーバーフローをスクロールするように設定した場合、問題の要素はスクロールバーを持ちます。 scrollHeightを返さないものの中には、スクロールの高さがないものもあります。コンテンツのすべてがセルに収まるためですが、確かにその一部がオーバーフローします。 – Ryan

関連する問題