MySQL查询表行上的onclick事件

Question

我打算在表行上运行查询onclick事件。

我在javascript中创建了一个函数，我可以读取每行的id。

现在我希望能够以此id作为条件运行查询。

他们可以帮我吗？

实现我的问题？

下面我展示了我的代码。

------------- Javascript功能-----------------！

    <script>
function addRowHandlers() {
    var table = document.getElementById("tableId");
    var rows = table.getElementsByTagName("td");
    for (i = 0; i < rows.length; i++) {
        var currentRow = table.rows[i];
        var createClickHandler = 
            function(row) 
            {
                return function() { 
                                        var cell = row.getElementsByTagName("td")[1];
                                        var id = cell.innerHTML;
                                        alert("id:" + id);
                                 };
            };

        currentRow.onclick = createClickHandler(currentRow);
    }
}
window.onload = addRowHandlers();
</script>

-----查询我打算运行-----------

$result= mysql_query("select * from tasks where idTask = id");

while($row = mysql_fetch_array($result))
{
    $image = $row['image'];
    header("Content-type:image/jpeg");
    echo $image;
}

Answer 1

您需要使用Ajax将id发送到单独的php文件，然后返回数据。我使用jQuery库，所以这个例子使用$.post() - （http://api.jquery.com/jquery.post/）和jQuery UI .dialog() - （http://jqueryui.com/dialog/）来弹出类似于alert()的结果

javascript代码

<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script>
function addRowHandlers() {
    var table = document.getElementById("tableId");
    var rows = table.getElementsByTagName("td");
    for (i = 0; i < rows.length; i++) {
        var currentRow = table.rows[i];
        var createClickHandler = 
            function(row) 
            {
                return function() { 
                                        var cell = row.getElementsByTagName("td")[1];
                                        var id = cell.innerHTML;

                                        //use ajax to post id to ajax.php file
                                        $.post( "ajax.php", { id:id }, function( data ) { 
                                              //add result to a div and create a modal/dialog popup similar to alert()
                                              $('<div />').html('data').dialog();
                                        });

                                 };
            };

        currentRow.onclick = createClickHandler(currentRow);
    }
}
window.onload = addRowHandlers();
</script>

ajax.php（单独的文件，随机命名为ajax.php）

$id = mysql_real_escape_string($_POST['id');    

$result= mysql_query("select * from tasks where idTask = $id");

while($row = mysql_fetch_array($result))
{
    $image = $row['image'];
    header("Content-type:image/jpeg");
    echo $image;
}