es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

  • es.davy.ai/
  • Programación /
  • añadir más elemento seleccionado, no reemplazar elemento seleccionado en el menú desplegable

añadir más elemento seleccionado, no reemplazar elemento seleccionado en el menú desplegable

27 Jul, 2023 Programación

Encontré este código en internet

http://jsfiddle.net/bvotcode/owhq5jat/

Cuando selecciono un nuevo elemento, el elemento antiguo se reemplaza por el nuevo elemento.

¿Cómo puedo añadir más elementos sin reemplazar cuando hago clic en “lista desplegable”?

Gracias

<select id="select1">
<option></option>
<option>AAA</option>
<option>BBB</option>
<option>CCC</option>
<option>DDD</option>
<option>EEE</option>
</select>
<textarea style="height:150px;width:150px" id="t1"></textarea>
<textarea style="height:150px;width:150px" id="t2"></textarea>

<script>
$("#select1").change(function () {
    $("#t1").val($(this).find(':selected').text());
});

$("#select1").change(function () {
    $("#t2").val($(this).val());
});
</script>
Tags:  , , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Para agregar más elementos sin reemplazar los existentes en el área de texto al hacer clic en la lista desplegable, puedes modificar el código javascript existente de la siguiente manera:

    <select id="select1">
    <option></option>
    <option>AAA</option>
    <option>BBB</option>
    <option>CCC</option>
    <option>DDD</option>
    <option>EEE</option>
</select>
<textarea style="height:150px;width:150px" id="t1"></textarea>
<textarea style="height:150px;width:150px" id="t2"></textarea>

<script>
    $("#select1").change(function () {
        // obtener el elemento seleccionado
        var selectedItem = $(this).find(':selected').text();
        // obtener el valor actual del textarea t1
        var currentT1Value = $('#t1').val();
        // agregar el elemento seleccionado al valor actual de t1
        var newT1Value = currentT1Value + '\n' + selectedItem;
        // establecer el nuevo valor para el textarea t1
        $('#t1').val(newT1Value);

        // obtener el valor actual del textarea t2
        var currentT2Value = $('#t2').val();
        // agregar el elemento seleccionado al valor actual de t2
        var newT2Value = currentT2Value + '\n' + $(this).val();
        // establecer el nuevo valor para el textarea t2
        $('#t2').val(newT2Value);
    });
</script>

    Este código agrega el elemento seleccionado a los valores existentes en los textareas t1 y t2, en lugar de reemplazarlos por completo. El carácter \n agregado al valor actual del textarea garantiza que el nuevo elemento comience en una nueva línea.

Comments are closed.