gpt4 book ai didi

javascript - 如何获取引用号(链接形式)以使用javascript在另一个html页面中自动填写表格的一部分

转载 作者:行者123 更新时间:2023-11-30 19:32:55 25 4
gpt4 key购买 nike

使用本地存储和 onclick 与 javascript

我有一个包含 2 个职位描述的 html 文件:

html文件1

<li><Job Reference Number: wru01</li>
<li><Job Reference Number: wru01</li>

我需要创建一个链接(使用 javascript),当单击每个职位描述时,它会自动填写应输入职位描述的表格(此表格位于另一个 html 页面上)

html文件2:

<legend>Job Application Information: </legend>
<label> Job Reference Number: </label>
<input id="refnumber" type="text" name="refnumber" required="required" />

所以基本上我需要它,根据单击 wru01 或 wru02 的作业编号,它会自动使用本地存储在下一页的表单中填写作业引用编号。

我已经试过了

js文件1

function onclick1() {

var anchor = document.getElementById('link');

anchor.addEventListener('click', function(event) {
event.preventDefault();

const jobCode = event.target.getAttribute('data-job');

localStorage.setItem('job-code', jobCode);

//need redirect user to apply page
//console.log(event.target)
window.location = event.target.getAttribute('href');

})
}


function onclick2() {


var anchor = document.getElementById('link2');


anchor.addEventListener('click', function(event) {
event.preventDefault();

const jobCode = event.target.getAttribute('data-job');

localStorage.setItem('job-code', jobCode);

//need redirect user to apply page
//console.log(event.target)
window.location = event.target.getAttribute('href');

})
}

function init() {

document.getElementById("link").onclick = function() {
onclick1()
};
document.getElementById("link2").onclick = function() {
onclick2()
}
window.onload = init;
}

js文件2

function LoadJobCode() {
var code = localStorage.getItem('job-code');

if (code) {
var input = document.getElementById('refnumber');
// disable text being entered
input.value = code;
input.disabled = true;
}

}

最佳答案

对不起,这不是一个好主意。我认为你可以使用 setTimeout 来解决这个问题。这是我的代码:

function onclick1() {
var anchor = document.getElementById('link');
anchor.addEventListener('click', function (event) {
event.preventDefault();
const jobCode = event.target.getAttribute('data-job');
console.log(jobCode)
localStorage.setItem('job-code', jobCode);
setTimeout(() => {
window.location.href = event.target.getAttribute('href');
},1000)

})
}

我为什么要这样做?这是为了确保在进入另一个 html 页面之前保存数据(data-job)。同样,您可以使用 async/await,如下图:

function onclick1() {
var anchor = document.getElementById('link');
anchor.addEventListener('click', function (event) {
event.preventDefault();
const jobCode = event.target.getAttribute('data-job');
console.log(jobCode)
localStorage.setItem('job-code', jobCode);
async function locate() {
await new Promise(() => {
window.location.href = event.target.getAttribute('href');
})
}
locate();
})
}

关于javascript - 如何获取引用号(链接形式)以使用javascript在另一个html页面中自动填写表格的一部分,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56248817/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com