0

次のように、HTMLページにテキストボックスがあるとします。

<DIV style = "display:none;">
   <DIV style = "display:inline;">
      <INPUT type = "text" style = "display:inline;">
   </DIV>
</DIV>

この場合、テキストボックスはユーザーに表示されません。テキストが現在ユーザーに表示されていないことを確認するにはどうすればよいですか。

言わないでください。親オブジェクトまで移動して、それらが非表示に設定されているかどうかを確認する必要があります。このように検証するフィールドがたくさんあるため、アプリケーションのパフォーマンスが低下します。

このオブジェクトはユーザーに表示されないため、他に調べる方法はありますか?

前もって感謝します。

4

1 に答える 1

0

純粋な JavaScript である必要がない場合は、jQuery を使用することをお勧めします。:visible または :hidden セレクターを使用すると、目的が達成されます。

if ( $('yourElement').is(":hidden") ) {
    // The element is not visible
}

http://api.jquery.com/visible-selector/

http://api.jquery.com/hidden-selector/

純粋な JavaScript が必要で、すべての祖先要素をたどりたくない場合は、要素の offsetWidth と offsetHeight を確認してみてください。先祖要素のために要素が隠されている場合、それら両方とも 0 になるはずです。

var yourElement = document.getElementById('yourElementsId');

if ( yourElement.offsetWidth == 0 && yourElement.offsetHeight == 0) {
    // The element is not visible
}

https://developer.mozilla.org/en-US/docs/DOM/element.offsetWidth

https://developer.mozilla.org/en-US/docs/DOM/element.offsetHeight

于 2013-01-21T22:37:00.490 に答える