タグAjaxを使用している場合の変更イベント

現在、私はajaxを使用してデータベース結果を取得しようとしています。 <td>タグをクリックすると、Ajaxメソッドを使用して結果を取得します。現在、onchangeメソッドを使用しようとしましたが、テーブル行をクリックしても何も表示されません。私はそれを解決する方法を知ることができます。タグAjaxを使用している場合の変更イベント

これは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メソッドを使用したいと思います。

出典

2016-04-02 anonymous5671

<td>にはchangeメソッドがありません。代わりにonclickイベントを使用してください。

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

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

出典

2016-04-02 06:50:27

あなたは<td>ためonclickイベントを設定することができます。また、クラス名を設定します。

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

そして、このように手動でクリックイベントをバインド：

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

出典

2016-04-02 07:14:22 Ali

それはまだ働いていません。それでも同じです – anonymous5671

私はちょうど1つの事を変更しました。 'this.value'に' this.innerHTML'を設定します。これを試して。また、 'alert'と' console.log（） 'を使ってコードをデバッグします。 – Ali

私はそれを試みても警告メッセージに入りませんでした。 – anonymous5671

我々は<td>

上のクリックはここで完全な例を整流だときの応答を取得するためにonClickイベントを使用することができます。

<!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>

出典

2016-04-02 07:24:13

私は試しましたが、このエラーメッセージを受け取りました。 'Uncaught ReferenceError：showArtistDetailsは定義されていません'。私はこれを解決する方法を知ることができますか？ – anonymous5671

​​タグAjaxを使用している場合の変更イベント

答えて

関連する問題

タグAjaxを使用している場合の変更イベント