javascript - 使用 jQuery .load() 将一个页面的脚本部分加载到另一个页面中

Question

我有一个 div，其中包含我在一个页面(我将其称为第 1 页)上使用 jQuery 生成的内容，我希望将其加载到第 2 页上:

<div id="latestNews">
  <h4>Latest News</h4>
  <ul>
    <!--Section automatically loaded here and to homepage -->
  </ul>
</div>

此第 1 页 div 包含使用以下代码创建的最近 5 篇文章的链接列表:

var $latestNews = $("#$latestNews ul");
var $titles = $("h3");

$titles.each( function( index, element ){
          var i = index + 1;
          if (i > 5) { return false; }

          var text = "<li> <a href='$url'>" + $(element).text() + "</a> /li>";

          $latestNews.append(text);   
});

在主页 第 2 页 上，我想加载相同的 div(并且仅加载该 div)，但也保留附加到它的脚本。否则，它会加载 div 及其内容而不创建列表项。

$homelines.load("http://.../Page1.php #latestEntries");

如果 Javascript/jQuery 有任何解决方案，请告诉我。第 1 页和第 2 页都是 PHP 语言，因此如果有 PHP 替代方案，我也愿意接受。

Answer 1

事实上，您并不是将新内容添加到第一个 PHP 页面，而是将其添加到 DOM。不同之处在于页面存储在网络服务器上，而 DOM 存在于虚拟空间中。

要将数据传输到第二页，您有几种选择。

(1) 如果使用按钮前进到下一页，按钮可以从 DOM 中抓取添加的内容，创建一个<form>包含新数据的构造，以及 post它到页面 2。页面 2 可以抓取传输的数据并在创建 DOM 时呈现它。 注意:其他访问者将无法获得此数据。

(2) 您可以将添加的内容存储在MySQL数据库表中。现在它可以显示在第 2 页上，供所有用户和 future 的访问者使用。

要存储 (MySQL) 添加的内容，您可以

(a) use a <form> construct与选项 (1) 相同，不同之处在于您将第 1 页重定向到一个中间页，该中间页将数据写入 MySQL，然后再次重定向到第 2 页，或者

(b) 使用 AJAX——这比听起来简单得多。 Here is a post其中包含一些简单的 AJAX 示例。