jQuery切換 - 只顯示一個div

我是JavaScript和jQuery的絕對初學者，試圖學習。我有一些表被觸發這個jQuery的：jQuery切換 - 只顯示一個div

$(document).ready(function() { 
    $('th').click(function() { 
     $(this).parents('table').find('td').slideToggle("fast"); 
    }); 
});

我想每次只顯示一個表，因此，如果您展示的第一個表，然後顯示另一個，第一個關閉。我會非常感謝任何指導。全部代碼在這裏：http://jsfiddle.net/qHGDF/1/

來源

2013-03-14 frassedylan

你可以顯示你的div/html嗎？ – 2013-03-14 14:14:21

請向我們展示您的html代碼樣本。 – 2013-03-14 14:14:30

對不起。完整的代碼在這裏：http://jsfiddle.net/qHGDF/1/ – frassedylan 2013-03-14 14:14:49

你需要隱藏打開的那些，要做到這一點的方法之一是找到所有的TD的是不是需要顯示和運行slideUp()之一：http://jsfiddle.net/qHGDF/4/

$('th').click(function() { 
    var thetd = $(this).parents('table').find('td'); 
    $('table td').not(thetd).slideUp("fast"); 
    $(thetd).slideToggle("fast"); 
});

來源

2013-03-14 14:28:46 superUntitled

太棒了！感謝大家。 superUntitleds的答案也允許關閉顯示的td。謝謝。 – frassedylan 2013-03-14 14:32:41

試試這個

$('th').click(function() { 
    $(".datagrid").children("table").find("td").slideUp(); 
    $(this).parents('table').find('td').slideToggle("fast"); 
    });

來源

2013-03-14 14:17:16

您可以隨時向上滑動所有其他TD的

$(document).ready(function() { 
    $('th').click(function() { 
     $("td").slideUp("fast"); 
     $(this).parents('table').find('td').slideToggle("fast"); 
    }); 
});

來源

2013-03-14 14:17:56 tymeJV

爲了做到這一點，你需要隱藏所有的TDS第一

var $ = jQuery.noConflict(true); 
     $('th').click(function() { 
      $('table td').hide(300); 
      $(this).parents('table').find('td').slideToggle("fast"); 
     });

fiddle

來源

2013-03-14 14:18:20

如果」就會對你的表記錄太多，並在渲染優化目的，幻燈片的<tbody>元素而不是<td>

來源

2013-03-14 14:32:12

你可以試試這個：http://jsfiddle.net/5hDVS/

$(document).on('click','div.datagrid',function() { 
    $('table td',this).slideToggle("fast"); 
    $('td',$(this).siblings('div.datagrid')).slideUp('fast'); 
});

來源

2013-03-14 14:37:13 kidwon

jQuery切換 - 只顯示一個div

回答

相關問題