我做了一个用PHP动态创建的表。
它基本上看起来像这样。
<table class="persist-area table table-bordered ">
<thead>
<tr class="persist-header">
<th>1. th</th>
<th>2. th</th>
<th>3. th</th>
<th>4. th</th>
</tr>
</thead>
<tbody class="maintable">
<span class="genTable" id="<?php echo $partnerId ?>">
</thead>
<tbody class="maintable">
<span class="genTable" id="<?php echo $partnerId ?>">';
<?php echo $partner->genTable();?>
</span>
</tbody>
</table>
</div>
</div>
我直接在我的partner.php
文件中有这个。
现在,我想创建一个 AJAX
函数,当您访问 partner 时加载此表.php以便每次用户对表进行更改时我都可以调用该函数。
所以我创建了这个javascript函数:
function genTable(){
$.ajax({ type: "POST",
url: "resources/dialogs/genTable.php",
data: {'partnerId': '1'},
success: function(msg){
$("div#gentable").html(msg);
}});
}
因此,这会对我创建的新文件发出POST
请求,该文件返回与上面完全相同的表。
但是现在我的其他JavaScript不再在桌子上工作了。例如,我正在运行另一个脚本,以使表标题在滚动时持久化:
function UpdateTableHeaders() {
$(".persist-area").each(function() {
var el = $(this),
offset = el.offset(),
scrollTop = $(window).scrollTop(),
floatingHeader = $(".floatingHeader", this)
if ((scrollTop > offset.top) && (scrollTop < offset.top + el.height())) {
floatingHeader.css({
"visibility": "visible"
});
} else {
floatingHeader.css({
"visibility": "hidden"
});
};
});
}
// DOM Ready
$(function() {
var clonedHeaderRow;
$(".persist-area").each(function() {
clonedHeaderRow = $(".persist-header", this);
clonedHeaderRow
.before(clonedHeaderRow.clone())
.css("width", clonedHeaderRow.width())
.addClass("floatingHeader");
});
$(window)
.scroll(UpdateTableHeaders)
.trigger("scroll");
});
上面的代码只是一个示例。所有其他与表交互的 javascript 也不起作用 - 有没有办法让我这样做?
我认为这与东西的加载方式有关?我应该使用 livequery
还是如何使我的其他脚本处理AJAX
生成的内容?
如前所述,如果我直接从文件加载表partner.php
则所有脚本都可以正常工作,但是当尝试使用AJAX
加载表时,它会中断。
任何帮助将不胜感激。
这实际上比你想象的要简单。
您需要做的就是将侦听器放在一个函数中,并在每次 ajax 加载完成时重新调用该函数。