1

私は Javascript の専門家ではなく、独学です。これはおそらく Javascript 101 だと思いますが、そのレッスンを見逃していたに違いありません。

次のコードを思いついたので、テーブル内の行をクリックすると (1 行おきに) テーブル内の 7 行が表示されます。きちんとしていないことはわかっていますが、私は自分自身に非常に満足しており、オフラインプレビューで実際に機能しました. ただし、Web サイトをアップロードすると、デフォルトですべての行が表示され、上の行をクリックして非表示にする必要があります。デフォルトでは、それらはすべて非表示になっているはずです。

ありがとう

これはコードです：

<script>
$('.openRow1').click(function(){
    $('.hiddenRow1').toggle();
})
</script>

<script>
$('.openRow2').click(function(){
    $('.hiddenRow2').toggle();
})
</script>

<script>
$('.openRow3').click(function(){
    $('.hiddenRow3').toggle();
})
</script>

<script>
$('.openRow4').click(function(){
    $('.hiddenRow4').toggle();
})
</script>

<script>
$('.openRow5').click(function(){
    $('.hiddenRow5').toggle();
})
</script>

<script>
$('.openRow6').click(function(){
    $('.hiddenRow6').toggle();
})
</script>

<script>
$('.openRow7').click(function(){
    $('.hiddenRow7').toggle();
})
</script>
4

3 に答える 3

1

次のようなことができます。

  <script>
for(var i=1; i<=7; i++) {
    $('.openRow'+i).click(function(){
        $('.hiddenRow'+i).toggle();
    }).css('visibility', 'hidden'); //this will make them invisible, but
}                                   //the elements will still take up that 
                                    //same amount of space. to completely remove
                                    //use *.css('display', 'none');

</script>

jQuery は DOM にあるデータのライブ表現であるため、jQuery 要素を変更すると、いつでも Web ページが変更されます。

于 2013-08-09T00:42:38.107 に答える