javascript - Row Onclick 函数无法工作可能是因为 ajax 表

Question

我现在可以显示我的表格，因为我使用 ajax 将表格从我的 php 文件回显到我的 html 索引文件中。但现在，我需要在单击时显示一个警报，它会告诉我接下来几列的值。我想点击类(class)，它会在警报中告诉我接下来几个季度的申请者数量(通过 javascript 函数)。

索引:

function gettable(string,strings)
        {

var a=string;
var b=strings;
if(a == null && b == null)
{
a = new Date().getFullYear();
b = "";
}

    if (window.XMLHttpRequest) {
        // code for IE7+, Firefox, Chrome, Opera, Safari
        var xmlhttp = new XMLHttpRequest();
    } else {
        // code for IE6, IE5
        var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            document.getElementById("inputtable").innerHTML = xmlhttp.responseText;

        }
    };

    xmlhttp.open("GET","gettabledata.php?q="+a+"&v="+b,true);
    xmlhttp.send();
        }

var name;
$(document).ready(function()
{
$('#table tr #abc').on('click', function(){

    name = $(this).text();
    alert(name);
});
})

gettabledata.php(我回显表格的文件):

    <?php

error_reporting(0);
$q = intval($_GET['q']);
$v = $_GET['v'];



if ($q=="")
{$i=date("Y");}
else
{
    $i=$q;
}
$i0=$i.'-01-01';

$i1=$i.'-03-31';
$i2=$i.'-06-31';
$i3=$i.'-09-31';
$i4=$i.'-12-31';

echo "<table id='table' class='clickable-row' border='1' style='width:100%'>
<tr id='header'>
<th>Courses</th>
<th>Quarter 1</th>
<th>Quarter 2</th>
<th>Quarter 3</th>
<th>Quarter 4</th>
<th>Total</th>
<th>Change In Volume (Compared to previous year)</th>
</tr>";

$con = mysqli_connect('localhost','root','','hi')or die ("Error :". mysqli_connect_error());

$output="";

if (!isset($_GET['v']))
{

$qry5 = "SELECT Category FROM hi.courses GROUP BY Category;";

$result5 = mysqli_query($con,$qry5);
while($row=mysqli_fetch_assoc($result5)){
    $var5=$row['Category'];

            $qry1 = "SELECT COUNT(*) FROM courses WHERE Category LIKE '$var5' AND Date BETWEEN '$i0' AND '$i1'";

            $result1 = mysqli_query($con,$qry1);

            $qry2 = "SELECT COUNT(*) FROM courses WHERE Category LIKE '$var5' AND Date<='$i2' AND Date>'$i1'";

            $result2 = mysqli_query($con,$qry2);

            $qry3 = "SELECT COUNT(*) FROM courses WHERE Category LIKE '$var5' AND Date<='$i3' AND Date>'$i2'";

            $result3 = mysqli_query($con,$qry3);

            $qry4 = "SELECT COUNT(*) FROM courses WHERE Category LIKE '$var5' AND Date<='$i4' AND Date>'$i3'";

            $result4 = mysqli_query($con,$qry4);

            $qry0 = "SELECT COUNT(*) FROM courses WHERE Category LIKE '$var5' AND year(Date)='$i'-1";
            $result0 = mysqli_query($con,$qry0);

            while($row=mysqli_fetch_assoc($result0)){
            $count0 = $row['COUNT(*)'];
            }

            while($row=mysqli_fetch_assoc($result1)){
            $count1 = $row['COUNT(*)'];
        }
        while($row=mysqli_fetch_assoc($result2)){
            $count2 = $row['COUNT(*)'];
        }
        while($row=mysqli_fetch_assoc($result3)){
            $count3 = $row['COUNT(*)'];
        }
        while($row=mysqli_fetch_assoc($result4)){
            $count4 = $row['COUNT(*)'];
        }
            $arrow="";
$space="<span>&nbsp;</span><span>&nbsp;</span>";
            $Total=$count1+$count2+$count3+$count4;
            if($Total<$count0)
            {
                $Volume=(($count0-$Total)/$count0)*100;
                $RevisedVolume= number_format($Volume, 2, '.', '');
                $arrow="<b><span style='color:Red;font-size: 150%;'>&#8595;</span></b>";
            }
            else if($Total>$count0)
            {
                $Volume=(($Total-$count0)/$Total)*100;
                $RevisedVolume= number_format($Volume, 2, '.', '');
                $arrow="<b><span style='color:#00FF00;font-size: 150%;'>&#8593;</span></b>";
            }
            else 
            {
                $Volume="No Change in volume";
                $arrow="";
            }

            if(is_numeric($Volume))
            {
                $RevisedVolume.="&#37;";
            }


            $output="
<tr id='table'>
<td class='cat' id='abc' value='$var5'>$var5</td>
<td class='cnt1' value='$count1'>$count1</td>
<td class='cnt2' value='$count2'>$count2</td>
<td class='cnt3' value='$count3'>$count3</td>
<td class='cnt4' value='$count4'>$count4</td>
<td class='cnt5' value='$Total'>$Total</td>
<td class='cnt6' value='$RevisedVolume'>$RevisedVolume$space$arrow</td>
</tr>";
            echo $output;
}

}

            else
            {

            $qry5 = "SELECT Category FROM hi.courses WHERE Category LIKE '$v%' GROUP BY Category;";

            $result5 = mysqli_query($con,$qry5);
            while($row=mysqli_fetch_assoc($result5)){
            $var5=$row['Category'];


            $qry1 = "SELECT COUNT(*) FROM courses WHERE Category LIKE '%$var5%' AND Date BETWEEN '$i0' AND '$i1'";

            $result1 = mysqli_query($con,$qry1);

            $qry2 = "SELECT COUNT(*) FROM courses WHERE Category LIKE '%$var5%' AND Date<='$i2' AND Date>'$i1'";

            $result2 = mysqli_query($con,$qry2);

            $qry3 = "SELECT COUNT(*) FROM courses WHERE Category LIKE '%$var5%' AND Date<='$i3' AND Date>'$i2'";

            $result3 = mysqli_query($con,$qry3);

            $qry4 = "SELECT COUNT(*) FROM courses WHERE Category LIKE '%$var5%' AND Date<='$i4' AND Date>'$i3'";

            $result4 = mysqli_query($con,$qry4);

            $qry0 = "SELECT COUNT(*) FROM courses WHERE Category LIKE '%$var5%' AND year(Date)='$i'-1";
            $result0 = mysqli_query($con,$qry0);

            while($row=mysqli_fetch_assoc($result0)){
            $count0 = $row['COUNT(*)'];
            }


            while($row=mysqli_fetch_assoc($result1)){
            $count1 = $row['COUNT(*)'];
        }
        while($row=mysqli_fetch_assoc($result2)){
            $count2 = $row['COUNT(*)'];
        }
        while($row=mysqli_fetch_assoc($result3)){
            $count3 = $row['COUNT(*)'];
        }
        while($row=mysqli_fetch_assoc($result4)){
            $count4 = $row['COUNT(*)'];
        }



            $arrow="";
            $space="<span>&nbsp;</span><span>&nbsp;</span>";
            $Total=$count1+$count2+$count3+$count4;
            if($Total<$count0)
            {
                $Volume=(($count0-$Total)/$count0)*100;
                $RevisedVolume= number_format($Volume, 2, '.', '');
                $arrow="<b><span style='color:Red;font-size: 150%;'>&#8595;</span></b>";
            }
            else if($Total>$count0)
            {
                $Volume=(($Total-$count0)/$Total)*100;
                $RevisedVolume= number_format($Volume, 2, '.', '');
                $arrow="<b><span style='color:#00FF00;font-size: 150%;'>&#8593;</span></b>";
            }
            else 
            {
                $Volume="No Change in volume";
                $arrow="";
            }

            if(is_numeric($Volume))
            {
                $RevisedVolume.="&#37;";
            }


            $output="
<tr id='table'>
<td class='cat' value='$var5'>$var5</td>
<td class='cnt1' value='$count1'>$count1</td>
<td class='cnt2' value='$count2'>$count2</td>
<td class='cnt3' value='$count3'>$count3</td>
<td class='cnt4' value='$count4'>$count4</td>
<td class='cnt5' value='$Total'>$Total</td>
<td class='cnt6' value='$RevisedVolume'>$RevisedVolume$space$arrow</td>
</tr>";

        echo $output;

        }
}

Answer 1

id='table' 在您的代码中重复。请从 tr 中删除 id = "table"。

并且您需要修改 onClick 函数，例如...

$('#inputtable').on('click', '#table tr #abc',function(){

我的事。对你有帮助......