的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）

回答

相关问题