我要完成的工作:
我有一个 div 来跟踪用户的统计信息。当点击用户时,div 的内容会被一个 ajax 请求回显页面替换为用户的详细信息。每 10 秒,div 将使用 ajax 刷新,因此旧内容,所有用户的统计信息再次显示。
我的问题:加载页面后,点击用户时,onclick 事件效果很好;详细信息将加载。大约 10 秒后,旧的 ALL 用户统计信息会刷新 div 内容。
到目前为止一切顺利,除了 onclick 事件对新内容不起作用......
这是我的代码:
Javascript:
var x;
var namen;
window.onload = function(){
x = true;
$("submitnieuw").observe('click', addturf);
$("submitdelete").observe('click', verwijderturf);
setInterval(function (){
if(x === true){
alert("a");
x = $('stats').getElementsByTagName('tr');
jQuery("#stats").load("stats.php");
jQuery("#recent").load("vandaag.php");
namen = $('stats').getElementsByTagName('tr');
for(var i = 1; i < namen.length; i++){
namen[i].observe('click', select);
}
}
}, 10000);
namen = $('stats').getElementsByTagName('tr');
for(var i = 1; i < namen.length; i++){
namen[i].observe('click', select);
}
};
function select(naam){
//highlight the selected list element
var name = naam.findElement('tr').id;
jQuery.ajax('details.php',{
data: {
'Naam': name,
'door': $("door2").value
},
type: 'post',
success: function(data){
$("stats").innerHTML = data;
},
error: ajaxFailure
});
}
function detail(ajax){
var text = ajax.responseText;
alert(text);
L = text;
}
function verwijderturf() {
var naam = $("naam").value;
$("naamnieuw").value = "";
$("naam").value = "";
$("redennieuw").value = "";
jQuery.ajax('server.php',{
data: {
'mode': 'verwijderturf',
'naam': naam,
'door': $("door2").value
},
type: 'post',
success: update,
error: ajaxFailure
});
}
function addturf() {
var naam = $("naamnieuw").value;
var reden = $("redennieuw").value;
$("naamnieuw").value = "";
$("naam").value = "";
$("redennieuw").value = "";
jQuery.ajax('server.php',{
data: {
'mode': 'addturf',
'naam': naam,
'door': $("door2").value,
'reden': reden
},
type: 'post',
success: update,
error: ajaxFailure
});
}
function update(ajax){
jQuery("#stats").load("stats.php");
jQuery("#recent").load("vandaag.php");
}
function ajaxFailure(ajax, exception) {
alert("Error making Ajax request:" +
"\n\nServer status:\n" + ajax.status + " " + ajax.statusText +
"\n\nServer response text:\n" + ajax.responseText);
if (exception) {
throw exception;
}
}
stats.php(再次加载的内容):
<?php
include_once("db.php");
?>
<?php
$names = mysql_query("SELECT Naam From users");
$feedData = '';
$feedData .= "<fieldset>";
$feedData .= "<legend>Turfjesteller</legend>";
$feedData .= "<table border=0>";
$feedData .= "<tr>";
$feedData .= "<td>Naam</td>";
$feedData .= "<td>Aantal</td>";
$feedData .= "<td>Gedaan</td>";
$feedData .= "<td>Resterend</td>";
$feedData .= "</tr>";
while($r = mysql_fetch_array($names)){
$feedData .= "<tr id=".$r['Naam'].">";
$feedData .="<td>" . $r['Naam'] . "</td>";
$sql="SELECT * FROM turfjes WHERE Naam='".$r['Naam']."' AND Type='Adtje'";
$result=mysql_query($sql);
$count=mysql_num_rows($result); //count = adtjes
$sql2="SELECT * FROM turfjes WHERE Naam='".$r['Naam']."' AND Type='Turfje'";
$result2=mysql_query($sql2);
$count2=mysql_num_rows($result2); //count2 = turfje
$feedData .="<td>" . $count2 . "</td>";
$feedData .="<td>" . $count . "</td>";
$feedData .="<td>" . ($count2-$count) ."</td>";
$feedData .="</tr>";
}
$feedData .="</table>";
$feedData .="</fieldset>";
echo($feedData);
?>
如前所述,页面看起来完全一样,但 onclick 事件不再起作用。
div 内容完全相同,所以我不知道出了什么问题。
namen = $('stats').getElementsByTagName('tr');
for(var i = 1; i < namen.length; i++){
namen[i].observe('click', select);
}
应该获取所有表行并再次向它们添加 onclick 事件...
在 10 秒后用 stats.php 替换 stats div 后,onclick 事件不再起作用..
谁能帮帮我?