Question

我正在做一个检查酒店和小屋可用性的页面。我做了php查询，结果显示我有哪些酒店和小木屋。但这是用桌子做的。

我需要的是将每个div放在tr之后（所有div和tr结果都有相同的类，分别）所以在div中我会显示一张地图（谷歌地图）和酒店的地址它的照片。 div的类是.slide，tr的类是.slide-toggle。

<script type="text/javascript">
    	$(document).ready(function(){
    		$('.slide').css("display", "none");
    		var table = document.getElementById("tablita");
    		for (var i = 0, row; row = table.rows[i]; i++) {
    	      $(table.rows[i]).click(function(){
    			$('.slide').slideToggle('fast').append('<tr class="slide-toggle"></tr>');
                //iterate through rows
                //rows would be accessed using the "row" variable assigned in the for loop 
    		
    	      });
    	    }
          });
    </script>

    echo "<tr class='slide-toggle'>"; ?>
    <?php
    		
      //if($disponibilidad !="COMPLETO"){

    ?>
<td>
  <div align='left' class="Estilo11"><span class='style1'><?PHP 	echo utf8_encode($row['Establecimiento']) ?></span></div>
</td>
<td>
  <div align='left' class="Estilo11"><span class='style1'><?PHP 	echo utf8_encode($row['Categoria']) ?></span></div>
</td>
<td>
  <div align='left' class="Estilo11"><span class='style1'><?php 	echo $row['Direccion'] ?></span></div>
</td>
<td>
  <div align='left' class="Estilo11"><span class='style1'><?php 	echo utf8_encode($row['Telefono']) ?></span></div>
</td>
<td>
  <div align='left' class="Estilo11"><span class='style1'><?PHP 	echo $disponibilidad ?></span></div>
</td>

<?PHP
  echo" </tr>";
  echo "<tr class='slide'><div class='slide1'></div></tr>";
  echo"<td>&nbsp;</td>";
  echo "<td>&nbsp;</td>";
  echo "<td>&nbsp;</td>";

发生了什么，是当我点击tr时，所有的div一起打开，但在表之前。当我点击tr时，我需要在tr之后打开div（只有那个对应于那个tr的那个）才能将正确的信息传递给用户。

谢谢！

Answer 1

问题是，如果不是表格的一部分，则不能在表格行（tr）之后添加div。外面的一切都放在了错误的地方。

这是一个正常工作的代码（和JSFiddle）。

<?xpacket begin='' id=''?><x:xmpmeta xmlns:x='adobe:ns:meta/'>
<rdf:RDF xmlns:rdf='http://www.w3.org/1999/02/22-rdf-syntax-ns#'>

<rdf:Description rdf:about="" xmlns:GPano="http://ns.google.com/photos/1.0/panorama/">
    <GPano:UsePanoramaViewer>True</GPano:UsePanoramaViewer>
    <GPano:CaptureSoftware>Photo Sphere</GPano:CaptureSoftware>
    <GPano:StitchingSoftware>Photo Sphere</GPano:StitchingSoftware>
    <GPano:ProjectionType>equirectangular</GPano:ProjectionType>
    <GPano:PoseHeadingDegrees>350.0</GPano:PoseHeadingDegrees>
    <GPano:InitialViewHeadingDegrees>90.0</GPano:InitialViewHeadingDegrees>
    <GPano:InitialViewPitchDegrees>0.0</GPano:InitialViewPitchDegrees>
    <GPano:InitialViewRollDegrees>0.0</GPano:InitialViewRollDegrees>
    <GPano:InitialHorizontalFOVDegrees>75.0</GPano:InitialHorizontalFOVDegrees>
    <GPano:CroppedAreaLeftPixels>0</GPano:CroppedAreaLeftPixels>
    <GPano:CroppedAreaTopPixels>0</GPano:CroppedAreaTopPixels>
    <GPano:CroppedAreaImageWidthPixels>4000</GPano:CroppedAreaImageWidthPixels>
    <GPano:CroppedAreaImageHeightPixels>2000</GPano:CroppedAreaImageHeightPixels>
    <GPano:FullPanoWidthPixels>4000</GPano:FullPanoWidthPixels>
    <GPano:FullPanoHeightPixels>2000</GPano:FullPanoHeightPixels>
    <GPano:FirstPhotoDate>2012-11-07T21:03:13.465Z</GPano:FirstPhotoDate>
    <GPano:LastPhotoDate>2012-11-07T21:04:10.897Z</GPano:LastPhotoDate>
    <GPano:SourcePhotosCount>50</GPano:SourcePhotosCount>
    <GPano:ExposureLockUsed>False</GPano:ExposureLockUsed>
</rdf:Description>

https://jsfiddle.net/g61sobyg/4/

在tr

1 个答案: