0

ここで達成しようとしているのは、ユーザーが要素をクリックすると非表示になることです。これが発生すると、含まれている要素の内側に別の要素を追加して、これらすべてのアイテムを再び表示します。

var checkIfleft = $('#left .module'),checkIfright = $('#right .module');
   if(checkIfleft.hasClass('hidden')) {
       $('#left').prepend('<span class="resetLeft">Reset Left</span>');
        } else if(checkIfright.hasClass('hidden')) {
          right.prepend('<span class="resetRight">Reset Right</span>');
       }

私は複数の方法を試しましたが、正直なところ、.length ==1先頭に要素を 1 つだけ追加したいので、これが最善の策だと思います。私が持っている上記のJSは、新しいアイテムが機能した場合、非表示になるたびに新しい要素を追加すると思います。

その他の試み:

var checkIfleft = $('#left .module').hasClass('hidden'),
    checkIfright = $('#right .module').hasClass('hidden');
   if(checkIfleft.length== 1) {
       $('#left').prepend('<span class="resetLeft">Reset Left</span>');
        } else if(checkIfright.length== 1) {
          right.prepend('<span class="resetRight">Reset Right</span>');
       } 
      else if(checkIfleft.length==0){
          $('.resetLeft').remove()
      } else if (checkIfright.length==0){
         $('.resetRight').remove()
      }

基本的に、コンテナ内の1つの要素が非表示になっている場合、リセットボタンを表示したいのですが、リセットボタンを削除しない場合...

4

3 に答える 3

0

私は最近、CSS を使ってこのようなことをいくつか試してみましたが、アニメーション化しようとしないのであれば、非常にうまく機能すると感じています。これは、2つのモジュールの共通の親に「hideLeft」または「hideRight」クラスを追加/削除することにより、モジュールを非表示にしてリセットボタンを一度に表示できるjsfiddleです。

最初に両方のリセット ボタン div を非表示にすることで機能します。次に、 and を使用.hideLeft #left { display:none;}し.hideLeft #right .resetLeft { display: block; }て左側のモジュールを非表示にし、.hideLeft両方の要素の派生元である要素に が追加されたときにリセット ボタンを表示します。私はしばらく前に modernizr に触発され、物事を行うための優れた代替方法だと考えました。ご意見、ご感想、ご不明な点がございましたら、お聞かせください :)

于 2013-04-10T03:35:36.280 に答える