Question

我有一个可以展开和折叠其表行的表。我试图在其中显示我的数据库值。但是，只有第一行会扩展并显示行req的值。其他行没有扩展，也没有显示其值。

$(document).ready(function() {
  $('table').find('tr:gt(0)').hide();;
  $('#heading').addClass('hCollapsed');


  $("#heading").click(function() {
    $(this).parent().siblings().toggle();
    if ($(this).hasClass('hCollapsed')) {
      $(this).removeClass('hCollapsed').addClass('hExpanded');
    } else {
      $(this).removeClass('hExpanded').addClass('hCollapsed');
    }

  });
});

.hCollapsed::before {
  content: "+ ";
}

.hExpanded::before {
  content: "- ";
}

#heading {
  cursor: pointer;
}

<body>

<?php	  
	$info= "SELECT slider_issue.issue, slider_requirement.req FROM slider_issue
	INNER JOIN slider_requirement ON slider_issue.issue_id = slider_requirement.req_id";
	
		$queryres= mysqli_query($conn,$info);
		while ($rowwaf= mysqli_fetch_assoc($queryres))
		{
echo "	
<table>
  <tr>
    <td id=\"heading\" colspan=\"2\"><b>".$rowwaf["issue"]."</b></td>
  </tr>
  <tr>
    <td>".$rowwaf["req"]."</td>
  </tr>
</table>
";
		}
?>
        
</body>

Answer 1

您将标题用作ID，因此您的代码仅适用于第一行，因为Id在页面上是唯一的，将其更改为class，您将获得预期的输出。请在下面检查更新的代码。

$(document).ready(function() {
  $('table').find('tr:gt(0)').hide();;
  $('.heading').addClass('hCollapsed');


  $(".heading").click(function() {
    $(this).parent().siblings().toggle();
    if ($(this).hasClass('hCollapsed')) {
      $(this).removeClass('hCollapsed').addClass('hExpanded');
    } else {
      $(this).removeClass('hExpanded').addClass('hCollapsed');
    }

  });
});

.hCollapsed::before {
  content: "+ ";
}

.hExpanded::before {
  content: "- ";
}

.heading {
  cursor: pointer;
}

<body>

<?php	  
	$info= "SELECT slider_issue.issue, slider_requirement.req FROM slider_issue
	INNER JOIN slider_requirement ON slider_issue.issue_id = slider_requirement.req_id";
	
		$queryres= mysqli_query($conn,$info);
		while ($rowwaf= mysqli_fetch_assoc($queryres))
		{
echo "	
<table>
  <tr>
    <td class=\"heading\" colspan=\"2\"><b>".$rowwaf["issue"]."</b></td>
  </tr>
  <tr>
    <td>".$rowwaf["req"]."</td>
  </tr>
</table>
";
		}
?>
        
</body>

用数据库php的值扩展和折叠表行

1 个答案: