Größe der Textbox nach dem Setzen des Wertes auf ""

Question

Ich habe eine Textfläche, die automatisch wächst, wenn sie eingegeben wird und einige JS, um den Textbereich zu löschen, wenn eine Option geändert wird. Der Textbereich wird jedoch nicht verkleinert, wenn der Wert über JS auf "" gesetzt wird. Irgendwelche Vorschläge, wie ich das zum Laufen bringen kann?

function clearTextArea(){ 
 
\t document.getElementById('fldAdditionalInformation').value = ""; 
 
} 
 

 
function auto_grow(element) { 
 
    element.style.height = "0px"; 
 
    element.style.height = (element.scrollHeight+10)+"px"; 
 
}

<p>Change Value to clear Textbox: 
 
<select onchange="clearTextArea();"> 
 
<option>1</option> 
 
<option>2</option> 
 
<option>3</option> 
 
<option>4</option> 
 
</select> 
 
</p> 
 

 
<textarea style="width:100%;" id="fldAdditionalInformation" onkeyup="auto_grow(this)"></textarea>

Answer 1

sollten Sie auto_grow ausführen, nachdem Sie den Textbereich löschen.

function clearTextArea(){ 
 
    var element = document.getElementById('fldAdditionalInformation'); 
 
    element.value = ""; 
 
    auto_grow(element) 
 
} 
 

 
function auto_grow(element) { 
 
    element.style.height = "0px"; 
 
    element.style.height = (element.scrollHeight+10)+"px"; 
 
}

<p>Change Value to clear Textbox: 
 
<select onchange="clearTextArea();"> 
 
<option>1</option> 
 
<option>2</option> 
 
<option>3</option> 
 
<option>4</option> 
 
</select> 
 
</p> 
 

 
<textarea style="width:100%;" id="fldAdditionalInformation" onkeyup="auto_grow(this)"></textarea>