#javascript #html #local-storage
Вопрос:
<form action="apply.html" method="post">
<div class="cloudinformation">
<h2>
Job reference number:
</h2>
<br>
<h4>
1FN43
<br>
<input type="submit" value="Apply">
</div>
</form>
<form action="apply.html" method="post">
<div class="cloudinformation">
<h2>
Job reference number:
</h2>
<br>
<h4>
6LZ9W
<br>
<input type="submit" value="Apply">
</div>
</form>
У меня есть 3 разные формы на 1 странице, и мне нужно использовать JavaScript, чтобы сделать это там, где, в зависимости от того, какую форму я отправляю, соответствующий справочный номер задания будет храниться в локальном хранилище и отображаться в другой форме на другой странице, вышеупомянутой ‘apply.html» страница в форме только для чтения. Я знаю только, как сохранить ввод, но не текст, уже указанный в форме. Должен ли я сделать 3 отдельных ‘apply.html» страницы для каждой формы или как я могу сделать это, используя 1 для всех 3 форм.
Примечание: Я не могу использовать jQuery.
<form action="https://mercury.swin.edu.au/it000000/formtest.php" method="post" id="regform">
<label>Job Reference Number</label>
<input type="text" id="onlyletters" name="onlyletters" pattern="[a-zA-Z0-9] " minlength="5" maxlength="5" placeholder="Reference number for specified job.." required="required">
<label for="fname">First Name</label>
<input type="text" id="fname" name="firstname" placeholder="Your name.." required="required" maxlength="25" onkeypress="return (event.charCode > 64 amp;amp; event.charCode < 91) || (event.charCode > 96 amp;amp; event.charCode < 123) || (event.charCode==32)">
<label for="lname">Last Name</label>
<input type="text" id="lname" name="lastname" placeholder="Your last name.." required="required" onkeypress="return (event.charCode > 64 amp;amp; event.charCode < 91) || (event.charCode > 96 amp;amp; event.charCode < 123) || (event.charCode==32)">
<label for="start">Date of birth:</label>
<input type="date" id="start" required="required" name="trip-start" value="2021-08-30">
<br>
<br>
<label for="gender"> Select you gender</label>
<br>
<br>
<select name="gender" id="gender" required="required">
<option value="" selected>Please Select</option>
<option value="male">Male</option>
<option value="female">Female</option>
</select>
<br>
<label for="streetname">Street Address</label>
<input type="text" id="streetname" name="streetname" required="required" placeholder="Your street name..." maxlength="40" />
<label for="suburb">Suburb/Town</label>
<input type="text" id="suburb" name="suburb" required="required" placeholder="Your suburb/town..." maxlength="40">
<label for="state">Choose a state:</label>
<br>
<select name="state" id="state" required="required">
<option value="">Please Select</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>
<br>
<br>
<label for="postcode">Postcode</label>
<input type="text" id="postcode" name="postcode" required="required" placeholder="Your postcode..." maxlength="4" minlength="4" pattern="^[0-9]{4}$">
<label for="email">Email Address</label>
<input type="text" id="email" name="emailadd" placeholder="Your email address.." required="required">
<label for="phone">Phone Number</label>
<input type="text" id="phone" name="phonenumb" placeholder="e.g. 0451124561" minlength="8" maxlength="12" required="required">
<input type="submit" value="Apply">
</form>
Комментарии:
1.
I only know how to store an input but not text already on the form.
Можете ли вы это объяснить ?2. Как и в случае, справочный номер задания является константой, а не чем-то, что вам нужно вводить. Я бы знал, как его сохранить, только если бы это был ввод, который запрашивал у вас номер справки о работе.
3. Взгляните на документ. Селектор запросов . Это должно помочь вам получить доступ к текстовому значению из DOM.
4. В качестве альтернативы вы можете добавить скрытый ввод , если у вас есть рука на форме. Таким образом, вы сможете получить доступ к этому значению при отправке.
Ответ №1:
Из того, что вы нам показываете, я склонен полагать, что первые формы, предназначенные для передачи ссылок на вакансии в реальную форму подачи заявки, являются излишними. Я думаю, что простой ссылки было бы достаточно. Например:
<div class="cloudinformation">
<h2>
Job reference number:
</h2>
<br>
<h4>6LZ9W<h4>
<br>
<a href="apply.html?job_reference=6LZ9W">Apply</a>
</div>
После того, как вы сможете легко получить доступ к ссылке на работу в javascript со страницы «Применить»:
// Retrieve job_reference from url parameter.
let params = (new URL(document.location)).searchParams;
let jobReference = params.get('job_reference');
// Set the form input value
document.querySelector('#onlyletters').value = jobReference;
Комментарии:
1. Огромное спасибо. Это сработало, за исключением того, что по какой-то причине я не могу сохранить его и извлечь. Не могли бы вы знать, как я могу использовать JavaScript для его хранения и извлечения в другой форме?
2. На что это
apply.html
похоже ?3. Хотите, чтобы я загрузил код здесь в комментариях?
4. Лучше добавьте это к вашему вопросу. Трудно точно знать, чего вы пытаетесь достичь.
5. Выполнено. Имейте в виду, что раздел «Справочник по работе» для apply.html будет заменено тем, что я пытаюсь сделать.