1

したがって、whileループを使用してデータベースから生成されたテーブルがあります。データは行で表示されます。重要なのは、クリックするだけで利用できるデータ(詳細の表示など)を含む「非表示」の行があるということです。基本的に私はこのようなものが欲しいです:http://www.transfercar.co.nz/-テーブルの行をクリックすると、より多くのデータが下に表示されます(新しい行に)。

私のコードは次のようになります。

while ($row = mysqli_fetch_array($r, MYSQLI_ASSOC)) {
$display1=$display1+1;
    echo '
    <tr class="tablerow">
        <td>' . $row['id'] . '</td>
        <td><p class="state">' . $row['name'] . '</p></td>
        <td><p class="state">' . $row['surname'] . '</p></td>
        <td>' . $row['country'] . '</td>
        <td>' . $row['city'] . '</td>
        <td>' . $row['category'] . '</td>
    </tr>';
if($row['id']==$_GET['showrow'])
{
    echo '
    <tr class="subtable" style="display:none;">';
        echo '<td colspan="3" class="detalji"></td>
        <td align="left" colspan="3" class="detalji"></td>
        </tr>';}} // End of WHILE loop.
echo '</table>';

私のjQueryは次のようになります。

/* Table row click */
$(".tablerow").click(function()
{
  $(".subtable").show();
}); 

$(".subtable").click(function()
{
  $(".subtable").hide();
}); 

ポイントは、一度クリックするとすべてのサブテーブルが表示されることです。当然、クリックしたテーブルの行の下にあるサブテーブルのみが必要です。

4

2 に答える 2

1

これを試して

$(".tablerow").click(function() {
    // Hideing all the tr with class subtable rows initially
    $('.subtable').hide();
    // Find the next tr which has class subclass in current context
    $(this).next('.subtable').show();
});

$(".subtable").click(function() {
    // Hide current row that has class subtable
    $(this).hide();
});​
于 2012-09-28T18:05:31.367 に答える
0

私はこのようなコードを使用してそれを解決することができました:

$(".tablerow").click(function()
{
  $(this).next(".subtable").slideDown("slow");
}); 

$(".subtable").click(function()
{
  $(".subtable").hide();
});

sushanth reddyはとても役に立ちました、ありがとう!このコードが機能する理由とSushanthが機能しない理由は正確にはわかりません。おそらくどこかにタイプミスがありますが、とにかくSusanthは正しい答えを提供したので、正しいコードで彼の応答を編集します。

于 2012-09-30T13:32:12.187 に答える