0

私のphpスクリプトは、各行にコースとボタンのリストを含むテーブルを作成します。ボタンの各セットは明らかに同じことを行う必要がありますが、その特定の行に対してです。各行には、class='add_button'、class='wait_button'、および class='detail_button' のボタンが含まれています。各ボタンの値は、その特定の行の courseID です。このスクリプトは ajax 経由でメイン ページに送り返され、ページの中央に挿入されます。

これらのボタンの 1 つをクリックすると、基本的な jquery イベントをトリガーして、各ボタンが適切に設定されていることをテストしたいと考えています。ただし、現在のコードは機能していないようです。同様の投稿でこれを見て、解決策を試しましたが、まだ何も得られませんでした。したがって、最初のスクリプトを残しました。あらゆる提案に感謝します。

courseDb.php:

while($row = mysqli_fetch_array($findCourses)){
echo "<tr>".
"<td><h3>" . $row['courseDept']. $row['courseNumber']. "-".$row['courseSection']."</h3>".
"<p>" . $row['courseName']."</p>".
"<td><p>Course Capacity: " . $row['courseSize']."/". $row['courseCurrent']."</p>".
"<p>Waitlist Capacity: " . $row['waitSize']."/". $row['waitCurrent']."</p></td>".
"<td><button class='add_button' value='".$row['courseID']."'>Add to Schedule</button></td>".
"<td><button class='wait_button' value='".$row['courseID']."'>Add to Waitlist</button></td>".
"<td><button href='#coursesDetailStud'  class='detail_button'  value=".$row['courseID'].">View detail</button></td>".
"</tr>";

}

course.php:

$(".add_button").click(function(){
var clicked = $(this);
alert(clicked.val());
});
4

1 に答える 1

2

このスクリプトは ajax 経由でメイン ページに送り返され、ページの中央に挿入されます。

これらの行 (およびボタン) は AJAX によって返され、ページが読み込まれた後に作成されるようです。

通常どおり、PHP または HTML ファイルに直接配置されたスクリプトは、ページの読み込み時に実行されます。単純にclickメソッドを使用すると、ページに既に存在する要素にイベントをバインドするだけであり、HTML 要素が後で AJAX および DOM 操作によって追加されても効果はありません。

on後でロードされる要素に対してもイベントをバインドするには、委譲が必要です。(親tableが HTML/PHP に存在すると仮定)

$('table').on('click', '.add_button', function(){
    //your code
});
于 2013-11-15T02:22:42.807 に答える