使用jQuery单击特定表行时创建弹出窗口

Question

我有一个来自外部PHP文件的自动生成的表，它基本上是嵌入在我的HTML页面上的MySQL查询结果。

当我点击该表格中的特定行时，如何创建弹出窗口？弹出窗口必须包含另一个MySQL查询结果，具体取决于所单击的行。

这是我生成的PHP表：

$response =  '<table>
            <thead>
                <tr>
                    <th>Name</th>
                    <th>Score</th>
                    <th>Last update</th>
                </tr>
            </thead>
            <tbody>';
while($row = mysql_fetch_array($sql))
{
    $name=$row['name'];
    $score=$row['score'];
    $maxscore=$row['max_score'];
    $refresh=$row['refresh'];

    $response .= 
        '<tr>
            <td>'.$name.'</td>
            <td>'.$score.' / '.$maxscore.'</td>
            <td>'.getTimeSince($refresh).'</td>
        </tr>';

    $count++;   
}
$response .= ' </tbody> </table>  ';

这是我的HTML区域：

<div id="tabel">
</div>

这是我用来嵌入表格的jQuery代码（不介意“区域”，它是图像映射的点击区域）：

<script type="text/javascript">
    $(document).ready(function () {
        $('.area').bind("click", function () {
            var area = $(this).attr('title');
            var response = getTable(area);

            $('#tabel').html(response);

        });

        function getTable(area) {
            if (window.XMLHttpRequest) {
                xhttp = new XMLHttpRequest();
            } else {
                xhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            var httpURL = "tabel.php?area=" + area;
            xhttp.open("GET", httpURL, false);
            xhttp.send();
            return xhttp.responseText;
        }
    });
</script>