編輯後無法使用Javascript填充文本框

Question

我有一個簡單的下拉框，並且當選擇下拉項目時，我成功地使用Javascript自動填充文本框。

當我編輯任何文本框的自動填充文本或使用「清除」按鈕擦除文本框時，下拉列表不再替換填充文本框。

用戶更改文本框後，如何繼續使用下拉框？

JSFiddle Version

HTML代碼：

<select id="dropdown" onchange="preset();"> 
    <option value="">Select a person:</option> 
    <option value="Abe" >Abe</option> 
    <option value="Bob" >Bob</option> 
    <option value="Cal" >Cal</option> 
    <option value="Dan" >Dan</option> 
</select> 

<input type=Submit value="Clear" onclick="document.getElementById('mytext').value='';"> 

<textarea id="mytext"></textarea> 

Javascript代碼：

function preset() { 
    document.getElementById("mytext").innerHTML=document.getElementById("dropdown").value 
} 

Answer 1

您使用innerHTML在一個地方，並value在另一個。在兩個修補程序中使用value它。

Demo

Answer 2

更新提交按鈕這樣：

<input type=Submit value="Clear" onclick="document.getElementById('mytext').innerHTML='';">