HTML page jump and parameter transfer issues

HTML page jump and parameter transfer issues

HTML page jump:

window.open(url, "", "width=600,height=400");

The second parameter: _self, opens the window in the current window; _blank (default value), opens the new window in another new window;

window.location.href="https://www.jb51.net"; //Open the window in the same current window window.history.back(-1); //Return to the previous page <a href="http://www.baidu.net" target="_blank">

HTML parameter passing:

1. URL parameter passing:

The first page (a.html):

var obj = a.value; // Pass to pop-up page parameter var url = 'jxb.html?obj='+obj;
url = encodeURI(url);
window.open(url, "", "width=600,height=400");

The second page (b.html):

var url = decodeURI(window.location.href);
var argsIndex = url .split("?obj=");
var arg = argsIndex[1];

Note: For Chinese transmission: you can use encodeURI to encode the URL on page a and decodeURI to decode the URL on page b.

2. Cookie parameter transmission:

function setCookie(cname,cvalue){
    document.cookie = cname + "=" + cvalue;
}
function getCookie(cname){
    var name = cname + "=";
    var ca = document.cookie;
}

3. localStorage object parameter passing:

a.html:

var div = doucment.getElementById('DIV ID name to get the string');
localStorage.string = div.textContent;

b.html:

var div = doucment.getElementById('DIV ID name to be written');
div.textContent = localStorage.string;

4. window.opener()

Parent page:

<input type="text" name="textfield" id="textfield"/>
window.open("subpage.html");

Subpages:

window.opener.document.getElementByIdx('textfield').value='123123123';

Summarize

The above is the editor's introduction to HTML page jump and parameter passing issues. I hope it will be helpful to everyone. If you have any questions, please leave me a message and I will reply to you in time. I would also like to thank everyone for their support of the 123WORDPRESS.COM website!

<<:  The difference between absolute path and relative path in web page creation

>>:  Implementation of new issues of CSS3 selectors

Recommend

Example code for element multiple tables to achieve synchronous scrolling

Element UI implements multiple tables scrolling a...

Tutorial on installing mysql8 on linux centos7

1. RPM version installation Check if there are ot...

Detailed steps for installing Tomcat, MySQL and Redis with Docker

Table of contents Install Tomcat with Docker Use ...

Use pure CSS to achieve scroll shadow effect

To get straight to the point, there is a very com...

Experience in designing a layered interface in web design

Many netizens often ask why their websites always ...

Common ways to optimize Docker image size

The Docker images we usually build are usually la...

Detailed explanation of linux nslookup command usage

[Who is nslookup?] 】 The nslookup command is a ve...

Introduction to container data volumes in Docker

Table of contents Docker container data volume Us...

Deploy grafana+prometheus configuration using docker

docker-compose-monitor.yml version: '2' n...

How to implement controllable dotted line with CSS

Preface Using css to generate dotted lines is a p...

Detailed explanation of the usage of scoped slots in Vue.js slots

Table of contents No slots Vue2.x Slots With slot...

Detailed explanation of how Nginx works

How Nginx works Nginx consists of a core and modu...

Detailed explanation of html-webpack-plugin usage

Recently, I used html-webapck-plugin plug-in for ...

Detailed explanation of JavaScript error capture

Table of contents 1. Basic usage and logic 2. Fea...

Layim in javascript to find friends and groups

Currently, layui officials have not provided the ...