时间戳

首页 > 解决方案 > 单击按钮后在页面之间传输数据

javascript - 单击按钮后在页面之间传输数据

问题描述

我正在创建一个网页，用户可以在其中申请公司的职位。我的目标是，一旦单击某个工作的链接，那么工作参考号就已经填写了适当的数据。但是文本框却充满了“未定义”

用于显示作业的页面和申请表的 JavaScript 文件 - 不要担心 validate 变量，我不想复制整个文件。

function storeJobNumber(jobRefNumber) {
    var da = document.getElementById("DA");
    var jd = document.getElementById("JD");
    var qa = document.getElementById("QA");
    var fed = document.getElementById("FED");

    if (da.onclick) {
        localStorage.setItem("jobNumber", jobRefNumber) == "188345"
    }

    if (jd.onclick) {
        localStorage.setItem("jobNumber", jobRefNumber) == "188386"
    }
    if (qa.onclick) {
        localStorage.setItem("jobNumber", jobRefNumber) == "188323"
    }
    if (fed.onclick) {
        localStorage.setItem("jobNumber", jobRefNumber) == "188357"
    }
}
function job_apply(){
    if (localStorage.getItem("jobNumber") !== null) {
        var jobNumber = document.getElementById("jobNumber")
        jobNumber.value = localStorage.getItem("jobNumber");
    }


}

function init() {
    if (document.getElementById("applypage")!=null) {
    var regForm = document.getElementById("regform");
    job_apply();
    regForm.onsubmit = validate;

    }
    else if (document.getElementById("jobspage") !=null) {
    storeJobNumber();
    }
}

window.onload = init;

申请表格 HTML

<!DOCTYPE html>
<html Lang="en"> 
<head>
    <meta charset="utf-8" />
    <meta name="description" content="CWA HELP DESK" />
    <meta name="keywords" content="HTML, CWA, Help, Desk" />
    <meta name="author" content ="Harry Keys" />
    <title>Application Form</title>
    <link href="style/style.css" rel="stylesheet" type="text/css">
    <script src="apply.js"></script>
</head>
<body id="applypage">

<form id="regform" method="post" action="http://mercury.swin.edu.au/it000000/formtest.php" novalidate="novalidate">
    <img src="images/logo.png" alt="Company Logo" />
    <h1> Job Application Form </h1>

<fieldset>
<p><label for="jobNumber">Job Reference Number</label>
<input type="text" onkeyup="this.value=this.value.replace(/[^\d]/,'')" name="jobNumber" id="jobNumber" maxlength="5" size="7" required="required" readonly/>
    </p>

包含可用作业的 HTML 文件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <meta name="description" content="Assignment Page 1" />
    <meta name="keywords" content="Home, Page, Details, Company" />
    <meta name="author" content ="Harry Keys" />
    <title>Available Jobs </title>
    <link href="style/style.css" rel="stylesheet" type="text/css">
    <script src="apply.js"></script>
</head>
<body id="jobspage">
<a href="index.html" class="button">Home</a>
<a href="jobs.html" class="button">Jobs</a>
<a href="about.html" class="button">About</a>
<a href="Enhancements.html" class="button">Enhancements</a>

<h1>Hartley Studios <img src="images/logo.png" alt="Company Logo" class="right"/> </h1>
<hr>
<section>
<fieldset class="JobsF">
<img src="images/Database.jpg" alt="Database Analyst"/>
<h3> Database Analyst </h3>
<p> The purpose of a Database Analyst is to Maintain data storage and access by designing physical databases...</p>
<a href="#DA" class="button">Discover</a>
<a href="apply.html" class="button" id="DA">Apply</a>
</fieldset>

<fieldset class="JobsF">
<img src="images/Software.jpg" alt="Software Developer"/>
<h3> Java Developer </h3>
<p> The purpose of a Java Developer is generally responsible for the development, design and implementation of Java products...</p>
<a href="#SD" class="button">Discover</a>
<a href="apply.html" class="button" id="JD">Apply</a>
</fieldset>

<fieldset class="JobsF">
<img src="images/QA.jpg" alt="QA Engineer"/>
<h3> QA Engineer </h3>
<p> The purpose of a QA Engineer is to put programs through rigorous tests, In an attempt to locate any areas of weakness...</p>
<a href="#QA" class="button">Discover</a>
<a href="apply.html" class="button" id="QA">Apply</a>
</fieldset>

<fieldset class="JobsF">
<img src="images/FED.jpg" alt="Front End Developers"/>
<h3> Front End Developer </h3>
<p> The front end of a website is the part users see and interact with – they play critical part of any business...</p>
<a href="#FED" class="button">Discover</a>
<a href="apply.html" class="button" id="FED">Apply</a>
</fieldset>
</section>

当用户单击 Database Analyst 的应用按钮时，文本框“jobNumber”应包含数字 188345，但它不包含任何内容或有时包含“未定义”

标签： javascripthtml

解决方案

的语法 localStorage.setItem是 .ItlocalStorage.setItem(keyname, value)应该像localStorage.setItem("jobNumber", "188345") 而不是localStorage.setItem("jobNumber", jobRefNumber) == "188345".Ref https://developer.mozilla.org/en-US/docs/Web/API/Web_Storage_API/Local_storage

推荐阅读