重新加载javascript而不刷新页面答案

【问题标题】：Reload javascript without refreshing page重新加载javascript而不刷新页面
【发布时间】：2012-03-06 14:12:23
【问题描述】：

免责声明：我对这些东西很陌生，所以请记住这一点。

你好，

我正在设置一个使用 AJAX 加载页面内容而无需离开页面的站点。我有几个页面使用 javascript 来加载列表信息。

这是链接设置的样子：

#home
#list.php?list=$list_id

我有一个名为 $list_id 的变量，并将它与一些 javascript 一起使用来加载列表。我面临的问题是，如果我加载一个列表（假设 ID 为 1 的列表）然后返回并加载另一个列表（假设 ID 为 2 的列表），javascript 尚未重新加载以说明新的列表 ID。

我是否可以重新加载 javascript 代码来解释新变量而无需刷新页面？

谢谢！

【问题讨论】：

请向我们展示完整的代码，以便我们提供帮助。 “返回”（在浏览器中？）是什么意思？

标签： javascript jquery ajax refresh reload

【解决方案1】：

我不明白你到底面临什么问题。但是如果你想在不刷新页面的情况下重新加载脚本，你可以这样做：

var script = document.createElement("script");
script.type = "text/javascript";
script.src = "somefile.js";
document.getElementsByTagName("head")[0].appendChild(script);

或者使用jQuery.loadScript函数

【讨论】：

如果脚本在页面中，我该怎么做。例如。请记住，我在页面中使用 JS，因为我在 JS 中使用 php 变量。

【解决方案2】：

在将 HTML 插入 DOM 时执行脚本。因此，当您通过 AJAX 加载一些 HTML 时，您可以执行包含的脚本。

【讨论】：

【解决方案3】：

您不能将 $list_id 存储在隐藏的输入字段中，然后在 ajax 调用后更新它吗？

例如

  <input type="hidden" id="list-id" value="<?php echo $list_id; ?>" />

  <script>
  //ajax request
  var  $list_id = $('#list-id');
  $.ajax({
  url:'http://www.example.com/page.php',
  data:'list_id=' + $list_id.val(),
  success:function(data){
     //do something

     $list_id.val() = $list_id.val() + 1;
 }
 });

只是快速拼凑起来给你一个想法，所以可能有一些 js 错误

【讨论】：

【解决方案4】：

您可以使用 jQuery 的 getScript() 函数来动态获取（和执行）脚本。例如：

$.getScript("/js/myscript.js");

【讨论】：

脚本不在外部文件中。我在 php 文件中使用

【解决方案5】：

由于您根本没有发布任何代码，因此我在这里进行了疯狂的猜测。

在这种情况下，您不必重新加载 Javascript 代码，但您可以将数据适当地存储在对象中。

请向我们展示一些 JS 代码以正确回答您的问题。

【讨论】：

【解决方案6】：

通常，最好在这里设计一个协议。您应该有一个函数来解析正在加载的任何“列表”，一个函数来解析 URL 哈希，以及一个函数来加载新列表。您可以使用location.hash 获取 URL 哈希。

这是一个简单的例子，它期望列表是某种格式。所以它将是基于协议的，因为在你的 Javascript 中应该只需要加载一次，并且它应该期望某种特定的格式，它能够在没有任何附加依赖项的情况下进行解析。实际上需要依赖关系是可以的，但是应该如何/何时/何处将所有内容都纳入协议。

<a class="listLoader" href="#list.php?list=1">List 1</a>
<a class="listLoader" href="#list.php?list=2">List 2</a>
<a class="listLoader" href="#list.php?list=3">List 3</a>

.

$('.listLoader').onclick(function() {
    $.ajax({
        'success': function () {
            //Do what you gotta do with your lists
        },
        'url': location.hash.substring(1)
    });
});

【讨论】：