繁体   English   中英

如何在不刷新页面的情况下重新加载javascript?

[英]How to reload javascript without refreshing the page?

我有一个网页,通过标签链接一些JavaScript。 该脚本是amazon-localiser.js,它将把amazon链接更改为适合访问者的链接。 例如,Amazon.com链接将交换给英国访问者的amazon.co.uk或德国访问者的Amazon.de。它还会在链接后附加相关的亚马逊会员链接。

当用户登陆页面时,他们会单击一些选项(javascript),但是到您到达亚马逊链接时,必须刷新页面才能使amazon-localiser.js脚本正常工作。 我尝试使用HTML中的页面刷新,但这使我回到了问题的开头。 如何重新加载javascript而不影响用户在网站上的位置?

该站点为www.wfbsir.com,如果您选择“ Scifi”,然后选择“ Maybe”,那么您将进入amazon.com链接,如果将鼠标悬停在该链接上,则刷新页面后将看到该链接指向amazon.com。向您显示到本地商店的链接,并附加一个会员链接。

html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title>What book should I read?</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="manifest" href="/manifest.json">
    <meta name="msapplication-TileColor" content="#ffffff">
    <meta name="msapplication-TileImage" content="/ms-icon-144x144.png">
    <meta name="theme-color" content="#ffffff">

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
    <link rel="stylesheet" href="app.css" />

  </head>
  <body>
<div class="wrapper">
  <div class="container">
    <div class="row">
      <div class="col-xs-12 text-right">
        <button class="btn btn-default btn-corner" type="submit" data-bind="click: startOver, visible: queryData().id > 0">Start over</button>
      </div>
    </div>
  </div>

  <div class="container main">
    <div class="row">
      <div class="c12 text-center">
        <h1 data-bind="text: queryData().text"></h1>
        <h3 data-bind="text: queryData().subhead"></h3>
        <h3><a data-bind="text: queryData().link, attr: {href: url}"></a></h3>
        <div class="option-group" data-bind="foreach: queryData().answers">
          <button class="btn btn-default btn-lg" type="submit" data-bind="click: $parent.goToTarget, text: text"></button>
        </div>
        <button class="btn btn-default" type="submit" data-bind="click: stepBack, visible: navHistory().length > 1">Previous Step</button>
                            <button class="btn btn-default" type="submit" data-bind="click: buyBook, visible: navHistory().length > 1">Buy the book</button> 
             </div>
    </div>
  </div>
  <div class="push"></div>
</div>


<script src="http://ajax.aspnetcdn.com/ajax/knockout/knockout-3.3.0.js"></script>
<script src="app.js?v=0.4.0"></script>
    <script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript" src="amazon-localiser.js"></script>
<script>

</script>

我试过使用jQuery getScript和window.location.reload(); 但都不能只重载javascript,我唯一能找到的就是F5 / Refresh。

我注意到, amazon-localiser.js localiser.js会在页面加载时调用函数findLocation onload,如下所示。

if (window.addEventListener) {
    window.addEventListener("load", findLocation, false)
} else {
    window.attachEvent("onload", findLocation)
}

因此,可能需要解决的问题是,当您需要更新Amazon链接时再次调用此函数。 我尝试从控制台调用它并且它可以工作,因此请尝试在需要时手动调用findLocation()并查看它是否findLocation()您的范围。

西蒙妮

您可以在某些条件下在页面上动态添加脚本,例如:

var script = document.createElement('script');
var src;

if (true) {
  src = 'amazon.co.uk';
} else {
  src = 'amazon.com';
}
script.src = src;
document.head.appendChild(script);

正如gnllucena所说,您可以查看问题或找到解决方案。

  1. 构建加载器功能:

将以下代码放入文档中

<script type="text/javascript">
function LoadMyJs(scriptName) {
var docHeadObj = document.getElementsByTagName("head")[0];
var newScript= document.createElement("script");
newScript.type = "text/javascript";
newScript.src = scriptName;
docHeadObj.appendChild(newScript);
}
</script>


// place a button for reloading script.

<input type="button" name="reloadNewJs" value="Reload JavaScript" onClick="LoadMyJs('needed_script.js')">

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM