Php 使用AJAX/jquery加载内容，并且仍然能够在生成的DOM上使用其他javascript函数

我制作了一个使用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>

因此，这会对我创建的新文件发出一个

POST

请求，该文件返回与上面完全相同的表

但是现在我的其他Java脚本不再在表上工作了。 例如，我运行了另一个脚本，以使表格标题在滚动中持久化：

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");

    });

函数UpdateTableHeaders（）{
$（“.persist area”）.each（函数（）{
var el=$（此），
偏移量=标高偏移量（），
scrollTop=$（窗口）.scrollTop（），
floatingHeader=$（“.floatingHeader”，this）
如果（（scrollTop>offset.top）&&（scrollTop

上面的代码只是一个示例。所有其他与表交互的Javascript也都不起作用-有什么方法可以让它起作用吗

我在想这和货物的装载方式有关？我应该使用

livequery

还是让我的其他脚本在

AJAX

生成的内容上工作

如前所述，如果我直接从

partner.php

文件加载表，所有脚本都可以正常工作，但是当尝试使用

AJAX

加载表时，它会中断

---

任何帮助都将不胜感激

这实际上比你想象的要简单

---

您只需将侦听器放在一个函数中，并在每次ajax加载完成时重新调用该函数。

当该函数运行时，

$（“.persist area”）。每个（function（）{

（在DOM就绪时）只“处理”现有DOM。在进行ajax调用并将新HTML注入DOM后，您需要重新运行

$（.persist area”）。每个（function（）{

在那块新的DOM上。谢谢@SergiuParaschiv-你能告诉我怎么做吗？可能会重复将所有侦听器放在类似listeners（）{//here}的函数中的最后一块代码中；然后在AJAX成功块中调用它，如下所示：listeners（）；请记住，如果AJAX多次调用，您将有多个侦听器。因此，您需要删除旧的侦听器或防止类的重复。

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");

    });