Question

我想要做的是“当用户点击表格中的名称时，应显示相应的详细信息。如果用户再次点击他/她的名字，则应隐藏详细信息。” 表格如下：

Name                 Details
aaa kkk             Date of Birth: 2016-05-06  Email:aaa@gmail.com
Elliot Botwright    Date of Birth: 1975-08-19  Email:Elliot.Botwright@gdu.edu.au

目前我正在尝试使用

为表格内容分配增量ID

    if ($result->num_rows > 0) {
    $i=1;
    echo "<table><tr><th>Name</th><th>Details</th></tr>";
    while($row = $result->fetch_array(MYSQLI_ASSOC)) {
    echo "<tr><td id='names'.$i.''>" . $row['Name']. "</td><td  id='details'.$i.''>Date of Birth: ". $row['DOB']. "<br>Email: ".$row['Email']."</td></tr>";
    $i++;
    }
    echo "</table>";
    }
And then in jQuery:
    <script>
    $(document).ready(function(){
    $('[id^=details]').hide();
    $('[id^=names]').click(function(){
    var number = $(this).attr("id");
    number = number.replace('names', '');
    if($('[id=details'.number.']').is(':hidden')) {$('[id=details'.number.']').show();}
    else{($('[id=details'.number.']').hide();}
    });
    });
</script>

我使用$('[id^=details]').hide();来隐藏详细信息，它可以正常工作。然后我尝试使用var number = $(this).attr("id");获取点击名称的ID并删除names的部分。然后我尝试隐藏并显示与所点击的名称共享相同编号的详细内容。但是这部分不起作用并使所有jQuery代码无效。你能帮帮我吗？

在jQuery中匹配元素id

0 个答案: