1 
  $('#0show').hide();
  $('#0click').click(function(event) {
     $('#0show').toggle();
     $('#1show').hide();
     $('#2show').hide();
  });    

  $('#1show').hide();
  $('#1click').click(function(event) {
     $('#1show').toggle();
     $('#0show').hide();
     $('#2show').hide();
  });        

  $('#2show').hide();
  $('#2click').click(function(event) {
     $('#2show').toggle();
     $('#0show').hide();
     $('#1show').hide();
  });

コードを再利用できるようにしようとしていて、兄弟セレクターを使用したいと考えています。基本的に、すべてのショーが同じであるため、dom を変更する必要があるため、ショー クラスだけを作成しますか? しかし、CSS でこれらのセレクターを使用するにはどうすればよいですか?

html (いくつかの提案クラスとして使用するために、編集する必要があります)

<a class='clicked' href='#' id='0click'>Reveal Image Uploader</a> 
<div id='0show'> 
    <div class='column first'> 
        <div class='fieldWithUpload' id='upload_id_5' style='margin-top: 10px'> 
            <div class='uploadHolder'> 
                <div id='bgUploaderButton'></div> 
                    <span class='uploadProgressbar'></span> 
                </div> 
            </div> 
        </div> 
    </div> 
</div>
4

1 に答える 1

1

複数の開閉セクションの簡単なパターンを次に示します。IDを使用する必要はありません

<a class='link' href='javascript://'>Reveal Image Uploader</a> 
<div style="display:none" class="details"> ... </div>

JS:

$('.link').click(function) {
    $('.details').hide()
    $(this).next('.details').show()
}
于 2011-09-13T18:27:54.907 に答える