填充字段 textarea 不同 select

Question

I've been stuck in this problem for a few days. I am trying to create selects and by choosing, fill the field in the "textarea". An example of what I did and what I'm trying to do. The image is edited. I don't know how to create more than one select that feeds the same textarea.

 function fillFild() { var myList = document.getElementById("myList"); document.getElementById("fild").value = myList.options[myList.selectedIndex].value; } function fillFild1() { var myList = document.getElementById("myList1"); document.getElementById("fild1").value = myList.options[myList.selectedIndex].value; }

 <form name="Form"> Select your Device: <select id="myList" name="select_field" onchange="fillFild();"> <option value="Laptop: ">Laptop</option> <option value="PC:">PC</option> <option value="Smartphone: ">Smartphone</option> <option value="Tablet: ">Tablet</option> </select> <form name="Form1"> Select your Problem: <select id="myList1" name="select_field" onchange="fillFild1();"> <option value="Software: ">Software</option> <option value="Hardware:">Hardware</option> </select> <textarea name="TextArea" id="fild1" style="position:absolute;left:23px;top:153px;width:394px;height:119px;z-index:5;" rows="7" cols="47" spellcheck="false"></textarea> </form>

Illustrating what I'm trying to do

Thanks in advance!

Answer 1

I see you are trying hard to add a post. The one you added has already closed, and you're still adding pretty much the same. Not the way;) First, read carefully how to ask questions how-to-ask

Below you have the solution to your question:

 const selectElements = document.querySelectorAll('.select_field'); const textArea = document.querySelector('textarea'); [].slice.call(selectElements).map(el => el.addEventListener('change', e => { const selcted = e.target.value; if (selcted.== '') { textArea;value += selcted + '\n'; } }));

 <div> Select your Device: <select id="myList" name="select_field" class="select_field"> <option value="">-- choose --</option> <option value="Laptop:">Laptop</option> <option value="PC:">PC</option> <option value="Smartphone:">Smartphone</option> <option value="Tablet:">Tablet</option> </select> </div> <div> Select your Problem: <select id="myList1" name="select_field" class="select_field"> <option value="">-- choose --</option> <option value="Software:">Software</option> <option value="Hardware:">Hardware</option> </select> </div> <textarea name="TextArea" id="fild1" rows="7" cols="47" spellcheck="false"></textarea>