2016-08-05 10 views
2

私は現在、変更されたバージョンのjQuery UIアコーディオンを使用するページを持っています。 jQueryのUIのアコーディオンのための参照用のリンク:JSが無効の場合、noscriptを使用してhtml要素を変更し、リダイレクトする

www.whatever.com/getWater

私が到達されます。私は、URLを打っていた場合、私のページについてはhttps://jqueryui.com/accordion/

<div id="accordion"> 
    <h3>Section 1</h3> 
    <div> 
    <p>abc</p> 
    </div> 

    <h3>Section 2</h3> 
    <div> 
    <p>def</p> 
    </div> 
</div> 

、 「セクション1」がアクティブであるページ。

私はURLを打っていた場合:

www.whatever.com/getFood

私は "第2章" がアクティブであることをページに到達します。

このページはJSが無効になっていると機能しません.JSが無効になっていると、このページに少なくとも基本機能が残っていることを確認する必要があります。

ので問題:

私はJS無効にすると、「第1」と/getWaterで午前ときと仮定がアクティブで、コンテンツが現れ、私はセクション2の内容を展開する「第2章」をクリックすることができなくなりますJSなし。だから、現在、私はこのための1つの可能な解決策を考えています

は、我々はページがある検出したとき、すなわち、リンクに<a>タグを<h3>タグを変更する<noscript>を使用することであるJS無効

だから、これになった(またはそれは、私が)この上のnoob午前しなければならないものは何でも:

<div id="accordion"> 
    <a>Section 1</a> 
    <div> 
    <p>abc</p> 
    </div> 

    <a>Section 2</a> 
    <div> 
    <p>def</p> 
    </div> 
</div> 

そして<noscript>に、私は、「第2章」が表示され、その逆/getFoodに私を導くことができるリンクを追加します。

可能ですか?

答えて

0

あなたがこのようなことをしたらどうですか?

<div id="accordion"> 
 
    <h3>Section 1</h3> 
 
    <a>Section 1 </a> 
 
    <div> 
 
    <p>abc</p> 
 
    </div> 
 

 
    <h3>Section 2</h3> 
 
    <a>Section 2</a> 
 
    <div> 
 
    <p>def</p> 
 
    </div> 
 
</div> 
 
<style> 
 
\t a{display:none;} 
 
</style> 
 

 

 
<noscript> 
 
\t <style> 
 
\t a{display:block !important} 
 
\t h3 {display:none} 
 
\t </style> 
 
</noscript>

:以下のコードをチェックし、ディスプレイ ah3を隠し、 <noscript>

追加CSS

関連する問題