2015-02-27 3 views
0

Хорошо, ребята, я начинаю изучать HTML, поэтому я новичок на данный момент. Я написал этот код, чтобы практиковать мои типы ввода (такие как пароль, электронная почта, текст и т. Д.). Я хотел бы знать, как я могу сбросить всю форму с помощью одной кнопки. Например:Как сбрасывать сразу несколько форм одной кнопкой

<input type="reset" value="reset"> 

Приведенный выше код должен иметь возможность сбросить всю форму.

В моем коде, у меня есть несколько форм и fieldsets:

<! DOCTYPE HTML> 
<html> 
<head> 
<title>Tutorial 5 </title> 
</head> 

<body>  
<form> 
<fieldset> 
<legend>Personal Details</legend> 

<p><label for="name">First name:</label> 
<input id="name" name="name" type="text" /></p> 

<p><label for="surname">Surname:</label> 
<input id="surname" name="surname" type="text" /></p> 

<p><label for="dob">Date of Birth:</label> 
<input id="dob" name="dob" type="text" size="5" /></p> 

<p><label for="email">E-Mail address: </label> 
<input id="email" name="email" type="email" /></p> 

<p><label for="address">Address:</label> 
<textarea id="address" name="address" type="text" rows="5" cols="30"></textarea> </p> 

<p><label for="postcode">Postcode:</label> 
<input name="postcode" id="postcode" type="text" size="5"></input> </p> 
</fieldset> 
</form> 


<form> 
<fieldset> 
<legend> Password and PIN </legend> 

<p><label for="password"> Password </label> 
<input id="password" name="password" type="password"></input> </p> 

<p><label for="passwordRetype">Retype Password</label> 
<input id="passwordRetype" name="passwordRetype" type="password"></input> </p> 

<p><label for="memorableQuestion"> Memorable question</label> 
<select id="memorableQuestion" name="memorableQuestion"> 
<option value="ChildhoodFriend"> Who was your childhood friend? </option> 
<option value="Street"> Whats the street you grew up in? </option> 
<option value="Food"> Whats your favorite food? </option> 
</select> </p> 

<p><label name="answerToQ"> Answer to memorable question: </label> 
<input id="answerToQ" name="answerToMemorableQuestion" type="text"</input> </p> 
</fieldset> 
</form> 

<form> 
<fieldset> 
<legend>Feedback</legend> 

<p><label for="radio"> Where did you hear about us mostly?</label> 
<p id="radio"> 

<input type="radio" name="feedback" value="social_media">Social Media<br> 
<input type="radio" name="feedback" value="advertisement">Advertisement<br> 
<input type="radio" name="feedback" value="Radio_ad">Radio Advertisement<br> 
</p></p> 

<p><label for="rate">Rate out service out of 10: </label> 
<input id="rate" name="rate" type="text" size="2" /></p> 
</fieldset> 
</form> 
</body> 
</html> 

как и что, когда я выводить его, я хотел бы текстовое поле, чтобы быть выровнены. (например, текстовые поля находятся под друг другом, и все они начинаются с одной и той же точки ... если вы знаете, что я имею в виду .. возможно ли достичь этого через float?)

+0

Почему у вас есть несколько форм, а не только один? – j08691

+0

@ j08691 Должен ли я иметь одну форму и несколько полей? – user3323950

+0

Если нет причин иметь более одного да, можно было бы сделать это. – j08691

ответ

0

Обычно вы использовали бы одну форму для захватить вход с действиями отправки/сброса внутри него.

Это связано с тем, что элемент FORM объединяет значения внутри них, чтобы отправить их обратно на сервер или действие формы.

Поэтому, если вы не ожидаете, что пользователь будет взаимодействовать с формами независимо друг от друга, тогда нет смысла разделить форму вверх. При объединении в одну форму кнопка сброса будет работать.

Для целей презентации вы должны использовать что-то вроде элементов DIV или что-то, что имеет смысл для макета, который вы пытаетесь создать.

0

После попытки каждый возможный метод, я обнаружил, что это самый простой:

window.open(document.URL,'_self'); 
Смежные вопросы