0

好的，所以我让它在单击时在用户名下下拉另一个，显示该用户的姓名、电子邮件等，但它会在每个用户名下下拉每个用户的用户信息，而不是在我点击的那个下方上。

有没有办法告诉它只显示下一个元素，而不是所有隐藏的元素？

我试过抓住点击的索引（带有用户名的那个，但我似乎无法使用任何类型的 index+1 类型逻辑来获得一个函数。

这是我现在拥有的代码：

<?php
  for ($output_user = 0; $output_user <= $num_pending - 1; $output_user++)
  {
    echo "\n\t<tr class=\"pending_users\">\n\t\t<td class=\"admin\">".$pending_user[$output_user][0]."</td>";
    echo "\n\t\t<td class=\"m_1\"><input type=\"checkbox\" value=\"approve\"/></td>";
    echo "\n\t\t<td class=\"m_l\"><input type=\"checkbox\" value=\"deny\"/></td>";
    echo "\n\t</tr>";
    echo "\n\t<tr class=\"showhide\">\n\t\t<td class=\"admin\" colspan=\"3\">Name:".$pending_user[$output_user][1]." ".$pending_user[$output_user][2]."\nEmail: ".$pending_user[$output_user][3]."\nEnrol Date: ".$pending_user[$output_user][4]."</td>\n\t</tr>";
    echo "\n\t</tr>";
  }
?>
<script>
 $(document).ready(function() {
  //Hides specific user details when the page loads
  $("div.show_user_info tr.showhide:visible").hide();

  //Makes every other row another bgcolor - effects pending user table only
  $("tr.pending_users:odd").css("background-color", "#ffff00");
 });

 $("td.admin").click(function () {
  var nextIndex = $("tr").index(this) + 1;
  $("div.show_user_info tr.showhide:hidden").slideDown("slow");
 });

 $("tr.showhide").click(function () {

  $(this).slideUp("slow");          
 });
</script>

我正在处理的页面是一个管理页面，用户可以在其中批准或拒绝注册请求。我正在使用 php 为正在等待注册的数据库中的每个用户动态创建一个表行。

话虽如此，当用户单击用户名所在的位置时，我想插入一个 + 来显示用户信息（姓名、请求日期等），并且当用户单击另一个与另一个用户名，并让它显示该用户的另一行等。

我用来创建表行的 php 是这样的：

<?php
    for ($output_user = 0; $output_user <= $num_pending - 1; $output_user++)
    {
        echo "\n\t<tr>\n\t\t<td class=\"admin\">".$pending_user[$output_user][0]."</td>";
        echo "\n\t\t<td class=\"m_1\"><input type=\"checkbox\" value=\"approve\"/></td>";
        echo "\n\t\t<td class=\"m_l\"><input type=\"checkbox\" value=\"deny\"/></td>";
        echo "\n\t</tr>";
    }
?>

我可以创建一个使用 php 执行此操作的 onclick 事件，还是需要使用 javascript？我一直在互联网上寻找类似的例子，但我找不到任何有用的东西。

4

3 回答 3

2

为了方便和跨浏览器兼容性，我为此使用了 jQuery，但如果没有它，你当然可以做到这一点（或者甚至根本没有 javascript，如果你的用户不介意每次都重新加载页面）。

我假设了一个结构，其中您将拥有一个details包含您希望默认隐藏的额外信息的类的元素。查看我的 jsFiddle以了解它在实践中是如何工作的。

$(".details").each(function() {
  var $link = $("<a href='javascript:void(0)'>+</a>");
  var $details = $(this);
  $details.hide().before($link);

  $link.on("click", function() {
    $details.toggle();
    $(".details").not($details).hide();
  });
});​
于 2012-10-06T02:46:47.670 回答
1

强烈建议您使用 jQuery 来实现这一点。<div id="user_info"></div>在您要显示信息的位置添加一个。

$("#YOUR USER DIV").click(function() {
    $("div#user_info").html("SOME USER INFORMATION WITH HTML");
});
于 2012-10-06T02:32:51.463 回答
0

您当然可以通过将可点击的“+”设置为一个链接来调用您的 php 脚本，并使用描述您单击的内容的查询字符串，并让 php 返回页面，其中包含查询字符串中命名的用户的额外详细信息......但是使用 javascript 可能会带来更好的用户体验。

于 2012-10-06T02:26:46.803 回答