如何将值从Java脚本传递到HTML？

Question

I have two files like

DataProcesser.js

var FROM;
 var TO;
var CONTECT;

function getValues(fromAdd,toAdd,ContectText){
 alert("method called");
  FROM=fromAdd;
  TO=toAdd;
  CONTECT=ContectText;
 alert("values are " + FROM +" "+ TO +" "+ CONTECT);
 window.open('email.html','newwindow');
}

EMail.html

During body onload

function loadData(){
    document.getElementById('lblFrom').innerHTML =window.FROM;
    document.getElementById('lbTo').innerHTML = window.TO;
    document.getElementById('lblfrom1').innerHTML = window.FROM;
    document.getElementById('lblto1').innerHTML = window.TO;
    document.getElementById('txtAreaBody').value =window.CONTECT;

}

How can i pass From, to, contect to EMail.html? I have written loadData function in Body Onload. Getting undefined values as a result.Calling the getvalues function from another HTML.

Answer 1

Every HTML document has its own Javascript context. So you can't access variables from one HTML page in another.

But what you can do, is transfer these variables as part of the URL. You can use the ?-operator to separate URL from data passed to it. Example:

email.html?from=somewhere&to=somewhereElse&connect=somevalue

The webserver will only interprete everyting up to the ? as part of the filename, the rest are GET-parameters passed to it. So the webserver will return the file email.html. On that page, you can then access the complete URL and parse the arguments using the variable document.location .

Another option is using cookies . But keep in mind that some users have cookies disabled (moreso than those which disable javascript), so you shouldn't rely on them for any primary functionality of your website.

The best way, however, would be to store all data on the server and use a session handling mechanism which uses cookies when available and GET-parameters as a fallback to assign a session-ID to each individual user. The most important advantage of this is that the user can not tamper with the data that easily. This, however, can not be done with client-sided javascript alone, because it needs server-sided scripting.

Answer 2

So the variable FROM, TO , CONTECT are being set sometime , inside getValues(). And then you call loadData(), so that the HTML loaded uses the values you obtained. So I'm assuming getValues() and loadData() are in the same JS context and the variables are directly accessible.

Change this code:

     document.getElementById('lblFrom').innerHTML =window.FROM;

to

      document.getElementById('lblFrom').innerHTML = FROM;

Do similarly for other variables.

PS: When posting code, please also specify the flow. Posting random code snippets won't help us understand the problem.