Question

目前，我正在尝试使用ajax检索数据库结果。单击<td>标记后，它将使用Ajax方法检索结果。目前，我尝试使用onchange方法，但在点击我的表格行后，没有任何内容出现。我可以知道如何解决它。

这是包含ajax的表格代码：

<!DOCTYPE HTML>
<html>
<head>
    <script>
    function showArtistDetails(str) {
        if (str == "") {
            document.getElementById("artist").innerHTML = "";
            return;
        } else { 
            if (window.XMLHttpRequest) {
                // code for IE7+, Firefox, Chrome, Opera, Safari
                xmlhttp = new XMLHttpRequest();
            } else {
                // code for IE6, IE5
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            xmlhttp.onreadystatechange = function() {
                if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                    document.getElementById("artist").innerHTML = xmlhttp.responseText;
                }
            };
            xmlhttp.open("GET","getArtist.php?q="+str,true);
            xmlhttp.send();
        }
    }
    </script>
</head>
<body>

<?php

require "pdoDB.php";
$categoryid = $_GET['q'];
$db = database::connect();
$albumsql = "SELECT c.catID, cd.catID, CDTitle, CDYear, CDPrice FROM tiptop_cd cd INNER JOIN
            tiptop_category c ON c.catID = cd.catID WHERE c.catID = ?";
$stmt = $db->prepare($albumsql);
// $stmt->bindParam("catid", $categoryid);
$stmt->execute(array($categoryid));

echo "<table>
<tr>
<th>Album Title</th>
<th>Released Year</th>
<th>Price</th>
</tr>";

while ($row=$stmt->fetch(PDO::FETCH_ASSOC)) {
    echo "<tr style=\"cursor: pointer;\">";
    // echo "<td>" . $row1['artistName'] . "</td>";
    echo "<td onchange=\"showArtistDetails(this.value)\">" . $row['CDTitle'] . "</td>";
    echo "<td>" . $row['CDYear'] . "</td>";
    // echo "<td>" . $row1['pubName'] . "</td>";
    // echo "<td>" . $row1['location'] . "</td>";
    echo "<td>" . $row['CDPrice'] . "</td>";
    echo "</tr>";
}

?>
    <div id="artist"></div>
</body>
</html>

getArtist.php包含数据库，以获取艺术家详细信息。我真的需要有人帮忙。提前致谢。目前，我使用ajax来检索相册详细信息。接下来是我想使用ajax方法从以下点击的相册中检索艺术家的详细信息。

Answer 1

<td>没有change方法，请改用onclick事件。

function sayhi() {
  alert("hi");
}

<table>
  <tr>
    <td onclick="sayhi()">sayhi</td>
  </tr>
</table>

Answer 2

您可以为onclick设置<td>个事件。并为它设置了一些类名：

<强> e.g。

<td onclick=\"showArtistDetails(this.innerHTML)\" class="change">

然后手动绑定click事件：

<script>
var myTd = document.getElementByClassName("change");
myTd.addEventListener('click', function(obj) {
    showArtistDetails(obj.html());
});
</script>

Answer 3

我们可以使用onClick事件在点击<td>

时获得回复

这里有一个完整的例子。

<!DOCTYPE HTML>
<html>
<head>
    <script>
    function showArtistDetails(str) {
        if (str == "") {
            document.getElementById("artist").innerHTML = "";
            return;
        } else { 
            if (window.XMLHttpRequest) {
                // code for IE7+, Firefox, Chrome, Opera, Safari
                xmlhttp = new XMLHttpRequest();
            } else {
                // code for IE6, IE5
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            xmlhttp.onreadystatechange = function() {
                if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                    document.getElementById("artist").innerHTML = xmlhttp.responseText;
                }
            };
            xmlhttp.open("GET","getArtist.php?q="+str,true);
            xmlhttp.send();
        }
    }
    </script>
</head>
<body>

<?php

require "pdoDB.php";
$categoryid = $_GET['q'];
$db = database::connect();
$albumsql = "SELECT c.catID, cd.catID, CDTitle, CDYear, CDPrice FROM tiptop_cd cd INNER JOIN
            tiptop_category c ON c.catID = cd.catID WHERE c.catID = ?";
$stmt = $db->prepare($albumsql);
// $stmt->bindParam("catid", $categoryid);
$stmt->execute(array($categoryid));

echo "<table>
<tr>
<th>Album Title</th>
<th>Released Year</th>
<th>Price</th>
</tr>";

while ($row=$stmt->fetch(PDO::FETCH_ASSOC)) {
    echo "<tr style=\"cursor: pointer;\">";
    // echo "<td>" . $row1['artistName'] . "</td>";
    echo "<td onclick=\"showArtistDetails(this.value)\">" . $row['CDTitle'] . "</td>";
    echo "<td>" . $row['CDYear'] . "</td>";
    // echo "<td>" . $row1['pubName'] . "</td>";
    // echo "<td>" . $row1['location'] . "</td>";
    echo "<td>" . $row['CDPrice'] . "</td>";
    echo "</tr>";
}

?>
    <div id="artist"></div>
</body>
</html>

使用Ajax的标记的Onchange事件

3 个答案: