Как отмечали другие, я думаю, вам следует пересмотреть необходимость пусто формы.Но, если вам действительно нужна эта функциональность, это один из способов сделать это:
Простой Javascript:
function resetForm(form) {
// clearing inputs
var inputs = form.getElementsByTagName('input');
for (var i = 0; i<inputs.length; i++) {
switch (inputs[i].type) {
// case 'hidden':
case 'text':
inputs[i].value = '';
break;
case 'radio':
case 'checkbox':
inputs[i].checked = false;
}
}
// clearing selects
var selects = form.getElementsByTagName('select');
for (var i = 0; i<selects.length; i++)
selects[i].selectedIndex = 0;
// clearing textarea
var text= form.getElementsByTagName('textarea');
for (var i = 0; i<text.length; i++)
text[i].innerHTML= '';
return false;
}
Обратите внимание, что я закомментировал случай, в котором я очищаю hiddenвходы.В большинстве случаев в этом нет необходимости.
Чтобы это работало, вам нужно вызвать функцию из обработчика onclick кнопки (или каким-либо другим способом), например, так:
<input type='reset' value='Reset' name='reset' onclick="return resetForm(this.form);">
Вы можете проверить все это здесь на jsFiddle .
Если вы используете jQuery в своем проекте, вы можете сделать это с гораздо меньшим количеством кода (и не нужно менятьHTML):
jQuery(function($) { // onDomReady
// reset handler that clears the form
$('form[name="myform"] input:reset').click(function () {
$('form[name="myform"]')
.find(':radio, :checkbox').removeAttr('checked').end()
.find('textarea, :text, select').val('')
return false;
});
});
Также обратите внимание, что я не очищаю значения скрытых входов, флажков и переключателей.
Играйте с этим здесь .