Question

试图弄清楚如何将信息从一个网页存储到申请页面上的表单中。基本上，第一页有两个用户可以申请的工作，两个工作都有一个特定于该工作的唯一5位数工作参考号。

用户可以单击跳转到同一应用程序页面的代码，但是特定的工作编号已保存在上面的表格中。

我了解需要javascript，但不确定如何使用它。有步骤的手会很棒。

下面有一些示例代码。

工作页面

  <ul>
        <li><strong>Job Reference Number: </strong>wru01</li>
        <li><strong> Position Title:</strong> CSS Website Designer</li>
        <li><strong> Salary range:</strong> $50-60k gross per year</li>
        <li><strong>Job Description:</strong> working and intergrating 
    with the HTML and Javascript team as well as with our clients in 
    designing 
    their asthetics of their website. The position will also entaile 
     research 
    into new CSS updates that can give WRU a competitive edge over 
     others</li>
        <li><strong>Head of CSS (report to):</strong> John Striger </li>
        <li><strong> Key responsibilities:</strong>
            <ol>
        <li>future research and updates of CSS</li>
        <li>working 1 on 1 with clients</li>
        <li>working with Html and Javascript teams to reach our company 
      goals</li>
        <li>Creating CSS for customers and designing their website</li>
            </ol>
        </li>
        <li><strong> Required Skills:</strong>
            <ol>
                <li> have passed Website development at uni</li>
                <li> have a portfolio of at least 5 CSS website 
    designs</li>
                <li> have over 2 years experience of working at a web 
    company</li>
                <li> Amazing people skills</li>
            </ol>

申请页面

  <form id=form action=https://mercury.swin.edu.au/it000000/formtest.php 
  method="post">

<fieldset style=width:50%>
    <legend> Personal Information:</legend>
    <label> First Name:
    <input type="text" name="firstname" pattern="^[a-zA-Z ]+$" 
 required="required" maxlength="20"/></label> 
    <br/><br/>
    <label> Last Name:
    <input type="text" name="lastname" pattern="^[a-zA-Z ]+$" 
 required="required" maxlength="20"/>
    </label> 
    <br/><br/>
    <label>Date of birth:  <input type="text" name="birth date" 
 placeholder="dd/mm/yyyy" maxlength="10" pattern="\d{1,2}\/\d{1,2}\/\d{4}" 
 required="required"/></label>
    <br/><br/>
</fieldset>
<fieldset style=width:50%>
    <legend> Gender:</legend> 
    <label>
    <input type="radio" name="gender" value="Male" checked="checked" 
 />Male</label>    
    <label>
    <input type="radio" name="gender" value="Female"  />Female</label>
     <br/><br/>
</fieldset>
<fieldset style=width:50%>
    <legend>Address</legend>
    <label> Street Address:
    <input type="text" name="address" required="required" maxlength="40"/> 
 </label> 
    <br /><br />
    <label> Suburb/Town:
    <input type="text" name="suburb" required="required" maxlength="40"
    pattern="^[a-zA-Z ]+$"></label> 
    <br/><br/>
    <label> Postcode:
    <input type="text" name="postcode" required="required" pattern="[0-9] 
 {4}"/></label> 
    <br/><br/>
    <label> State:
    <select name="rank" id="state">
    <option disabled selected value >Please Select Your State</option>

    <option value="Vic" >Vic</option>

    <option value="NSW" >NSW</option>

    <option value="QLD" >QLD</option>

    <option value="NT" >NT</option>

    <option value="WA" >WA</option>

    <option value="SA" >SA</option>

    <option value="TAS">TAS</option>

    <option value="ACT">ACT</option>   
    </select>  
    </label>
    <br /> <br />
    <label> Email Address
    <input type="email"
    placeholder="Enter your email">
    </label>
    <br /><br />
    <label> Phone Number:
    <input type="text" name="phonenumber" required="required"
    pattern="[0-9 ]{8,12}"/></label>        
   </fieldset>

  <fieldset style=width:50%>
 <legend>Job Application Information: </legend>
  <label> Job Reference Number:
    <input type="text" name="refnumber" required="required" pattern="[a- 
 zA-Z0-9]{5}"/></label>
 <br /><br />
 <label>Skill set:</label>
 <br />
 <label><input type="checkbox" name="skill[]" value="CSS" 
 checked="checked"/>CSS</label>
      <label><input type="checkbox" name="skill[]" value="HTML" 
 />HTML</label> 
      <label><input type="checkbox" name="skill[]" value="JavaScript" 
 />JavaScript</label>
      <label><input type="checkbox" name="skill[]" value="management" 
 />management experience</label>
      <label><input type="checkbox" name="skill[]" value="PHP" 
 />PHP</label>
      <label><input type="checkbox" name="skill[]" value="other" />other 
 skills (please list bellow)</label>
      <br/><br/>
      <label>Other Skills:</label>
      <textarea rows="4" cols="50" name="otherskills" placeholder="Enter 
 any other skills that would be usefull for the job..."></textarea>

  </fieldset>
<p>
    <button type="submit" value="submit">Submit</button>
    <button type="reset" value="submit">Reset</button>
    </p>

 </form>

Answer 1

尝试以下

工作页：在工作参考号上添加链接锚标记

<li><a href="link to form page?refnumber=wru01"><strong>Job Reference Number: </strong>wru01</a></li>

表单页面：HTML

<input id="refnumber" type="text" name="refnumber" required="required" />

表单页面：添加Javascript

<script type="text/javascript">
  window.onload=function(){
    var url_string = window.location.href;
    var url = new URL(url_string);
    var c = url.searchParams.get("refnumber");
    document.getElementById("refnumber").value=c;
  }    
</script>

将信息存储到下一页的表单页面上

1 个答案: