2016-06-29 18 views
0

私はタグを介していくつかのJavaScriptをリンクするウェブページを持っています。スクリプトはamazon-localiser.jsで、訪問者に適したアマゾンリンクに変更されます。例えばAmazon.comのリンクは、英国の訪問者のためにamazon.co.ukに、またはドイツの訪問者のためにAmazon.deにスワップします。また、関連するAmazonアフィリエイトリンクをリンクに追加します。ページを更新せずにjavascriptを再読み込みするには?

ユーザーがページ上を移動すると、いくつかのオプション(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> 

I)が(jQueryのgetScriptを使用して試してもwindow.location.reloadました。どちらもjavascriptだけをリロードしているわけではありません。私が動作することがわかっている唯一のものはF5/Refreshです。

+1

に次のコードを入れてhttp://stackoverflow.com/questions/9642205/how-to -force-a-script-reload-and-re-execute – gnllucena

答えて

0

次の例のように、いくつかの条件をページ上で動的にスクリプトを追加することができます

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

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

スクリプトに矛盾する変数がある可能性があるので、これは悪い考えではありませんか? –

+0

私はすでにユーザーのIPに基づいて関連するアマゾンストアに切り替えるためのスクリプトを持っていますが、ロードしたり、更新する必要はありません。 – HardLeeWorking

1

は、私はあなたが以下を参照できるようamazon-localiser.jsは、ページの機能findLocationのonloadイベントを呼び出すことに気づきました。あなたはアマゾンのリンクを更新する必要がある場合

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

だから、あなたの問題の可能な解決策は、再びこの関数を呼び出すためにである可能性があります。 私はコンソールから起動しようとしましたが動作しますので、必要なときに手動でfindLocation()を呼び出して、あなたのスコープに対応しているかどうか確認してください。

シモーネ

0

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')"> 
関連する問題