如何清除表單並將下拉菜單重置爲第一個選項？

我有一個窗體，其中包含文本字段，下拉菜單，單選按鈕和複選框。我能夠清除用戶輸入的所有輸入，但現在我需要修改表單，以便當用戶單擊「清除條目」時，所有上述字段將被清除，並且下拉菜單將返回到默認狀態的「PA」。如何清除表單並將下拉菜單重置爲第一個選項？

function doClear() 
{ 
document.PizzaForm.customer.value = ""; 
document.PizzaForm.address.value = ""; 
document.PizzaForm.city.value = ""; 
document.PizzaForm.state.value = ""; 
document.PizzaForm.zip.value = ""; 
document.PizzaForm.phone.value = ""; 
document.PizzaForm.email.value = ""; 

document.PizzaForm.sizes[0].checked = false; 
document.PizzaForm.sizes[1].checked = false; 
document.PizzaForm.sizes[2].checked = false; 
document.PizzaForm.sizes[3].checked = false; 

document.PizzaForm.toppings[0].checked = false; 
document.PizzaForm.toppings[1].checked = false; 
document.PizzaForm.toppings[2].checked = false; 
document.PizzaForm.toppings[3].checked = false; 
document.PizzaForm.toppings[4].checked = false; 
document.PizzaForm.toppings[5].checked = false; 
document.PizzaForm.toppings[6].checked = false; 
document.PizzaForm.toppings[7].checked = false; 
document.PizzaForm.toppings[8].checked = false; 
return; 
}

這是HTML表單的樣子：

<form> 
    <font size="3">State:</font> 
    <select name="State"> 
    <option selected>PA</option> 
    <option value="NJ">NJ</option> 
    <option value="NY">NY</option> 
    <option value="DE">DE</option> 
    </select> 
</form>

我不過PA選爲建議從一個人的時候沒有選擇PA點擊了明確的條目按鈕時。

來源

2015-06-01 Nina Fonseca

你看過[表單重置方法]（https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement/reset）還是[表單重置按鈕]（https：//開發者。 mozilla.org/en-US/docs/Web/HTML/Element/input）ie：'' –

主題看起來可能不像它，但這裏有一個重複：[*如何重置一個使用jQuery與.reset（）方法*]的表單（http://stackoverflow.com/questions/16452699/how-to-reset-a-form-using-jquery-with-reset-method/16453390#16453390）。所有需要的是重置按鈕，根本不需要腳本。 – RobG

要在下拉列表中選擇PA，您可以執行yourElement.selectedIndex =「0」; –

更新您的HTML所以PA選項的值

<option selected value="PA">PA</option>

添加下面的JS：

var elements = document.getElementsByTagName('select'); 
elements[0].value = 'PA';

一種更好的方式來獲得選擇是設置一個ID

HTML

<select name="State" id="mySelect">

document.getElementByID('mySelect'); 
element.value = 'PA';

這將阻止如果您添加了另一個選擇，（除非你添加了另一個選擇用這將是無效的HTML反正同一ID）

請問您有什麼問題

的jsfiddle演示

http://jsfiddle.net/8q6m2aa6/

來源

2015-06-01 03:21:57

工作將其重置爲PA。謝謝！ –

如何清除表單並將下拉菜單重置爲第一個選項？

回答

相關問題