简体   繁体   中英

Retrieve specific row from a table in another HTML file - Javascript

I was wondering if somebody could help me out with this one. I have 2 html pages, page1.html and page2.html. page1.html has an text box, a button, and 3 labels. page2.html has a table called mytable that has this data.

Number  Color   Shape
1       Red     Square
2       Blue    Circle
3       Orange  Triangle

On page1.html I am trying to input a number in the textbox, after hitting the button and will bring back the corresponding row into the 3 labels. So if I enter in 2, the 3 labels will show 2, Blue, Circle. Any ideas? I researched all over and the closest I got was this code below. Any help would be greatly appreciated.

page1.html

<!DOCTYPE html>

<html>
<head>
<title>Acknowledgement</title>
</head>

<body>
<script>

var value1="value1";
var value2="value2";
var queryString = "?para1=" + value1 + "&para2=" + value2;
window.location.href = "page2.html" + queryString;

</script>
</body>
</html>

page2.html

<!DOCTYPE html>
<html>
<head>
<title>Acknowledgement</title>
</head>
<body>
<h4>These are the data from page1.html.</h4>

<script>

var queryString = decodeURIComponent(window.location.search);
queryString = queryString.substring(1);
var queries = queryString.split("&");
for (var i = 0; i < queries.length; i++)
{
  document.write(queries[i] + "<br>");
}

</script>
</body>
</html>

You can use localstorage or

Assign value in page 1 before navigation window.myobj={val1:"val1",val2:"val2"}

Get data on page 2 var mydata=window.myobj; console.log(mydata.val1);

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

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