能夠讓div包含表的一部分嗎？

我正在製作一個遊戲和時間表，但我想用javascript來顯示/隱藏部分列表。一旦列出了5場比賽，接下來的所有比賽將被包含在div中，通過按下按鈕將顯示/隱藏。麻煩的是，我的div並不包含表中的任何行，這很奇怪，因爲代碼中有其他說法。能夠讓div包含表的一部分嗎？

我不允許製作包含表格部分的div嗎？

一如既往的感謝。

<table> 
<?php 
$result = @mysql_query('QUERY REMOVED'); 
$rows = mysql_num_rows($result); 

$count = 0; 
    if ($rows == 0) { 
     echo '<h3> No games on this day </h3>'; 
    } else { 
     while ($row = mysql_fetch_array($result)) { 

     **a bunch of variable assignments** 

     if($count == 5) echo '<tbody class="moreLess">'; 
     echo '<tr><td><a href="quotes.php?awayid=' . $awayteam_id . '&homeid=' . $hometeam_id . '&date=' . $date . '&time=' . $row['time'] . '&gameid=' . $game_id . '">' . $awayteam . ' @ ' . $hometeam . '</td><td>' . $time . '</td></a></tr>'; 
     $count++;    
     } 
    if($count >= 6) echo '</tbody>'; 
    } 
?> 
</table> 
<div class="moreLessSwitch"><span>More [+]</span></div>

如果你想要它，我使用JavaScript（測試工作）

$(function() {  
      $(".moreLess").hide(); 

      $(".moreLessSwitch").toggle(function() {    
       $(this).html("<span>Less [-]</span>");    
       $(this).prevAll(".moreLess").slideDown();   
      }, function() {    
       $(this).html("<span>More [+]</span>");    
       $(this).prevAll(".moreLess").slideUp();   
      }); 

     });

表輸出HTML：http://pastebin.com/raw.php?i=99iUYq6j

來源

2011-07-19 tnw

不，table和tr標記之間不能存在div標記。（而且應該）使用tbody劃定tr組。

結賬this fiddle。

[編輯]

New fiddle。

來源

2011-07-19 18:14:40 canon

我試圖改變我的div到'tbody'標籤，它只是部分工作。東西被正確包含在'moreLess'中，但是當我點擊'[+] More'時不會顯示' – tnw

顯示輸出html。 – canon

看到我的編輯在OP – tnw

你的HTML是無效的。除非在<td>單元格內，否則不能發生在<table>內，而您的跨度爲幾行<tr>行。一個更好的解決辦法是在.moreLess類分配錶行：

<tr class='moreLess'>

你的jQuery函數，然後滑入和淡出視野的錶行。

來源

2011-07-19 18:12:34

我更新了我的代碼，但它仍然無法正常工作。當我將「行初始化」和「行關閉」添加到'.moreLess'的開始和結束標記時，它會在表頂部顯示「行初始化」和「行關閉」！是吧？ – tnw

@Tory Waterman將代碼輸出爲HTML。 –

Here：http://pastebin.com/raw.php?i=99iUYq6j 這有點亂，但你可以看到我的東西被包含在'tbody class =「moreLess」' – tnw

TBODY是確定的行組正確的方法...

這個測試代碼的工作對我來說：

<!DOCTYPE HTML> 
<html lang="en-US"> 
<head> 
    <meta charset="UTF-8"> 
    <title></title> 
    <script type="text/javascript" src="../jquery/jquery.js"></script> 
    <script type="text/javascript"> 
     $(function(){ 
      $(".moreLess").hide(); 

      $(".moreLessSwitch").toggle(function() {    
       $(this).html("<span>Less [-]</span>");    
       $(".moreLess").slideDown();   
      }, function() {    
       $(this).html("<span>More [+]</span>");    
       $(".moreLess").slideUp();   
      }); 
     }) 
    </script> 
</head> 
<body> 

<table> 
<?php 

$rows = array(array(1,2,3),array(1,2,3),array(1,2,3),array(1,2,3),array(1,2,3),array(1,2,3),array(1,2,3),array(1,2,3),array(1,2,3),array(1,2,3)); 

$count = 0; 
    if ($rows == 0) { 
     echo '<h3> No games on this day </h3>'; 
    } else { 
     while ($row = array_pop($rows)) { 

     //**a bunch of variable assignments** 

     if($count == 5) echo '<tbody class="moreLess">' . "\r\n"; 
     echo '<tr><td><a href="quotes.php?awayid=' . $awayteam_id . '&homeid=' . $hometeam_id . '&date=' . $date . '&time=' . $row['time'] . '&gameid=' . $game_id . '">' . $awayteam . ' @ ' . $hometeam . '</td><td>' . $time . '</td></a></tr>' . "\r\n"; 
     $count++;    
     } 
    if($count >= 6) echo "</tbody>\r\n\r\n"; 
    } 
?> 
</table> 
<div class="moreLessSwitch"><span>More [+]</span></div> 

</body> 
</html>

來源

2011-07-19 18:29:31

什麼是\ r \ n'業務？我不熟悉那個標記 – tnw

'\ r \ n'只是增加了一個新行（windows格式 - @ CR @ LF）對我來說很有用，可以看到tbody標記被插入的位置 - 在最終實現時沒有必要 –

能夠讓div包含表的一部分嗎？

回答

相關問題