的javascript傳遞變量到下一個頁面（不包括PHP）

我在HTML和JavaScript是初學者所以你的幫助將非常感激。的javascript傳遞變量到下一個頁面（不包括PHP）

我創建接受來自表格值x和y，並進入它變成一個圖表的頁。

該圖是完全工作的同一網頁上，但我想在一個完全不同的頁面圖我點擊提交按鈕後。我怎樣才能將這些變量傳遞到不同的頁面並顯示相同的圖形？（我想避免的JQuery，PHP等完全因爲這是一個學校項目）

這裏是我的代碼：

function someFunction(){ 

var xScore = parseFloat(x) 
var yScore = parseFloat(y) 

google.charts.load('current', {'packages':['corechart']}); 
    google.charts.setOnLoadCallback(drawChart); 
    function drawChart() { 
    var data = google.visualization.arrayToDataTable([ 
     ['x', 'y'], 
     [ xScore ,  yScore], 

    ]); 

    var options = { 
     title: 'Sample Graph', 
     hAxis: {title: 'x value', minValue: 1, maxValue: 9}, 
     vAxis: {title: 'y value', minValue: 1, maxValue: 9}, 
     legend: 'none' 
    }; 

    var chart = new google.visualization.ScatterChart(document.getElementById('chart_div')); 

    chart.draw(data, options); 
}

這個圖表負載時我把體內的DIV以下。

<div id="chart_div" style="width: 900px; height: 900px;">

我想將這個div另一個HTML網頁的身體，但想發揚x和本網頁（它們是當表單提交生成）上生成y值。

來源

2016-01-23 Sid

如何使用。本地存儲？ –

使用查詢字符串？ – officert

這些頁面在**相同的域**上？ –

使用window.localStorage

把下面的文字對象以某種js文件，您將把從當前和下一個頁面（或只是將對象粘貼在必要時）來。

xyStore.SetX(12);

使用下一頁：

var xyStore = 
    { 
     GetX: function() { 
      return JSON.parse(localStorage.getItem("x"));     
     }, 
     GetY: function() { 
      return JSON.parse(localStorage.getItem("y"));     
     }, 
     SetX: function (x) { 
      localStorage.setItem("x", JSON.stringify(x)); 
     }, 
     SetY: function (y) { 
      localStorage.setItem("y", JSON.stringify(y)); 
     }, 
    };

在當前頁面使用

alert(xyStore.GetX()); // alerts: 12

編輯

繼@ RokoC.Buljan評論，此功能可擴展如下：

  Get: function (name) { 
       return JSON.parse(localStorage.getItem(name));     
      }, 
      Set: function (name, val) { 
       localStorage.setItem(name, JSON.stringify(val)); 
      }

來源

2016-01-23 14:08:52 remdevtec

爲什麼'GetX-Y'A-Z？傳遞**所需的** LS db **名稱**通過一個參數是否更簡單？ –

您好，非常感謝您解答我的問題的快速反應！ – Sid

@RokoC。Buljan好點的人。編輯。 – remdevtec

在配置爲method="GET"和action="/page2.html"的第一頁上使用簡單表單。形式中的輸入字段也應該具有name屬性填充，例如<input name="x">。然後，當您按下表單中的提交按鈕時，它會將字段名稱和值作爲查詢字符串傳遞到第二頁。例如/graph.html?x=123&y=456。

在要讀這些值了這第二頁，所以你需要分析它位於window.location.search查詢字符串。有這樣做的各種方式，但沒有內置的功能（這將永遠是一個字符串，例如x=123&y=456，你需要解析）。我將離開你提到它是一所學校的項目和最後一點將是下一個挑戰是開放的;）

（localStorage由@remdevtec描述也是當然的一個選項）

來源

2016-01-23 14:18:43 CharlesLeaf

感謝man urs和remdevtec的解決方案正在完美工作:-) – Sid

的javascript傳遞變量到下一個頁面（不包括PHP）

回答

相關問題