JS页面之间ajax跳转传值与接受传值
在JavaScript中,如果你想通过AJAX在页面之间传递值,你可以使用XMLHttpRequest
或fetch
API。以下是使用fetch
API的一个例子:
发送页面(发送值的页面):
// 假设你想发送的数据是一个对象 { name: 'John', age: 30 }
const data = { name: 'John', age: 30 };
fetch('receive_page.html', {
method: 'POST', // 使用POST方法发送数据
headers: {
'Content-Type': 'application/json' // 设置内容类型为JSON
},
body: JSON.stringify(data) // 将数据转换为JSON字符串
})
.then(response => response.text()) // 解析响应文本
.then(text => {
// 这里你可以处理接收页面的响应
console.log('数据已发送,服务器响应:', text);
})
.catch(error => {
console.error('发送失败:', error);
});
接收页面(接收值的页面):
// 确保页面加载完成后再读取数据
window.onload = function() {
const data = new FormData(document.querySelector('form')); // 假设是一个表单提交
// 通过FormData API,你可以获取到POST过来的数据
const name = data.get('name');
const age = data.get('age');
console.log('接收到的数据:', { name, age });
};
请注意,接收页面需要在服务器端进行处理,以便能够接收到通过POST
方法发送的数据。如果你使用的是服务器端语言(如PHP, Node.js等),你可以使用对应的方法来获取POST数据。
评论已关闭