Aiuto per variazione codice js jQuery

[Cosina]

Buongiorno, ho necessità di modificare il codice che segue per poter utilizzare più liste select con differenti id. Le voci evidenziate di ogni lista, dovrebbero, pero`, apparire nella medesima textarea incolonnandosi alle precedenti. Potreste dirmi se è possibile e, nel caso, mostrarmi un esempio completo? Grazie mille

<p>
    <select name="selectfield" id="selectfield">
        <option value="" selected>- Select -</option>
        <option value="STS">STS</option>
        <option value="PBN">PBN</option>
        <option value="EUR">EUR</option>
    </select>
</p>

<textarea style="width:100%" name="info" id="info" cols="20" rows="5"></textarea>

  <script
        src="https://code.jquery.com/jquery-3.3.1.min.js"
        integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
        crossorigin="anonymous"></script>

<script>
window.onload=function(){
      
$("#selectfield").on("change", function() {
    var $select = $(this);
    $("#info").val(function(i, val) {
      return val += '\n'+$select.val();
    })
});
    }
  </script>

[fcaldera]

domanda: che dovrebbe succedere se cambio l'opzione di una select già scelta in precedenza?
Il dato della textarea si sovrascrive o si aggiunge?

Nel tuo esempio una nuova selezione aggiunge il valore, quindi io mantengo la stessa logica

<form>    <select>
        <option value="" selected>- Select 1 -</option>
        <option value="STS">STS</option>
        <option value="PBN">PBN</option>
        <option value="EUR">EUR</option>
    </select>
    <select>
        <option value="" selected>- Select 2 -</option>
        <option value="VAL1">VAL1</option>
        <option value="VAL2">VAL2</option>
        <option value="VAL3">VAL3</option>
    </select>
    <select>
        <option value="" selected>- Select 3 -</option>
        <option value="FOO">FOO</option>
        <option value="BAR">BAR</option>
        <option value="BAZ">BAZ</option>
    </select>


    <textarea id="info" cols="20" rows="5"></textarea>
</form>




<script>
  var form = document.querySelector('form'),
      text = document.querySelector('textarea');
  
  /* il form resta in ascolto dell'evento change in 
   * fase di risalita dell'evento */
  form.addEventListener('change', function(event) {
    /* chi ha generato l'evento (target)? */
    var target = event.target;
    
    /* il target è una select? */
    if (target.matches('select')) {
      text.textContent = (text.textContent === '')
          ? target.value
          : [text.textContent, target.value].join('\n');
    }
  })
  
</script>

Alcune Note

1) non ho usato jQuery, non mi pareva necessario
2) non hai strettamente bisogno di aspettare l'evento load della pagina, ti basta avere il codice a fondo pagina quando il dom è stato caricato
3) non ti serve assegnare un id alle select e a meno che tu non stia inviando i dati di un form non ti serve nemmeno il name.
4) non ti serve assegnare un eventhandler per ogni select. Puoi registrare l'handler su un contenitore comune a tutte le select e aspettare che in fase di bubbling l'evento risalga (nell'esempio ho usato un form)
5) non puoi annidare una select in un paragrafo.
6) Live demo: https://codepen.io/anon/pen/jejzoo?editors=1000

[Cosina]

Grazie mille per le utili correzioni, fcaldera. Il codice l'avevo trovato in rete. Ne approfitto per chiederti un'altra cosa, forse un po' piu` complicata: credi che sarebbe possibile far sparire dall'elenco, nella textarea, le voci che venissero deselezionate dall'utente, durante le scelte, perche` ha un ripensamento? Forse chiedo troppo. In ogni caso, mi hai dato un grande aiuto. Queste cose mi servono, in realta`, proprio per un modulo di contatto, quindi il name ci vuole. Tutto gia` funzionante, mi mancava solo questo. Sei stato gentilissimo
p.s. scusa, aggiungo....ovviamente non si possono deselezionare le voci in select, ma stavo provando lo script anche sui checkbox con scelta multipla e ho visto che funziona, per questo ho fatto la domanda.

[Cosina]

Niente, ignora l'ultima domanda. Era pertinente solo utilizzando il primo codice con jQuery. Va benissimo cosi`, grazie ancora fcaldera e buona giornata. Ciao