0

div が display:none 以外の値に設定されているかどうかをチェックするスクリプトを作成するにはどうすればよいでしょうか。

アコーディオンの上に画像がありますが、アコーディオン要素をクリックすると、画像を上に隠したいと思います。

たとえば、コンテンツが「accord_content」というクラスの形式で、表示される画像が「image_over」であるとします。accord_content が表示されているかどうかを確認し、表示されている場合は「image_over」を非表示にするスクリプトを作成できますか?

if ('.accord_content.display !== 'none') {
        image_over.display = 'none')
        }

JavaScript が得意ではないため、これを完了する方法がわかりません。

ありがとう

新しい更新 - 確認したい html の抜粋が表示されます

<h3 class="title">Making the shortlist</h3>
        <div class="accord_content">
        <div class="content_left">

<p>CONTENT</p>

<p>CONTENT>
    </div>

これはjqueryアコーディオンUIを使用しているため、ページが開いているとき、クラスaccord_contentはdisplay:noneです。

h3 をクリックすると、display:block に変わります。

ありがとう

4

2 に答える 2

2

jQuery を使用すると、次のことができます。

Javascript 

if ($('.accord_content').css('display') !== 'none') {
    $('.image_over').hide();
}

デモ

これは次のように機能します。いずれか.accord_contentが表示されている場合、すべて.image_overが非表示になっています。

または、ネイティブの JavaScript でこれを行うことができます。

Javascript

if (document.querySelector('.accord_content').style.display !== 'none') {
    document.querySelector('.image_over').style.display = 'none';
}

デモ

これにより、 の最初のインスタンスが取得され、最初の が.accord_content非表示になります.image_over。このチェックは、 が css ではなくインライン属性としてdisplay: none設定されている場合にのみ false を返します。.accord_contentstyle

質問に関連するhtmlを実際に投稿する必要があります。また、これがどのように機能するかについての説明。あいまいな質問を投稿すると、あいまいな回答が得られます。時間をかけて良い質問を投稿すれば、人々は時間をかけて良い回答を投稿してくれます。

于 2012-12-05T01:42:59.643 に答える
0 
if (element.style.display !== 'none') {}
于 2012-12-05T00:54:20.293 に答える