Quiero crear una lista de fotos "Seleccionar" que, al elegir una, pueda presionar un botón y agregar un código a un área de texto junto con el valor elegido.
Escribí este código html con un archivo "JS" externo, pero al no estar familiarizado con javascript, no entiendo dónde me equivoco. Busqué un poco, pero solo encontré ejemplos con jquery y que operan on.change, mientras que necesito que se ingrese el valor cuando se presiona el botón, además debo agregar el texto adicional junto con la elección.
Me gustaría evitar el uso de JQuery por el hecho de que este código tiene que ejecutarse localmente sin actualizarse.
function Art_AddFoto() { var Fotoselect = document.getElementById('art_fotoselect'); var Selectvalue = Fotoselect.options[select.selectedIndex].value; var TextArea = document.getElementById('i251x'); TextArea.innerText += '<img src="' + Selectvalue + "' alt='Image'>"; }); <textarea class="textarea" style="height:200px;" name="art_testo" id="i251x"> </textarea> <select class="select" name="art_fotoselect" id="art_fotoselect"> <option value="test1">value1</option> <option value="test2">value2</option> </select> <div style="width:40%; display:inline-block;"> <input type="button" name="Art_AddFoto" value="Aggiungi Foto" onclick="Art_AddFoto()" class="button"> </div>Aquí puede ser un buen comienzo para usted:
Utiliza querySelector y EventListener
Art_AddFoto = (e) => { document.querySelector('#i251x').value += document.querySelector('#art_fotoselect').value+"\r\n"; } document.querySelector("#Art_AddFotoBtn").addEventListener('click',()=>{ Art_AddFoto(this) }) <textarea class="textarea" style="height:200px;" name="art_testo" id="i251x"></textarea> <select class="select" name="art_fotoselect" id="art_fotoselect"> <option value="test1">value1</option> <option value="test2">value2</option> </select> <div style="width:40%; display:inline-block;"> <button name="Art_AddFoto"class="button" id="Art_AddFotoBtn">Aggiungi Foto</button> </div>¡Estás muy cerca!
El único cambio que tuve que hacer en tu código fue cambiar select por Fotoselect :
function Art_AddFoto() { var Fotoselect = document.getElementById('art_fotoselect'); var Selectvalue = Fotoselect.options[Fotoselect.selectedIndex].value; var TextArea = document.getElementById('i251x'); TextArea.innerText += '<img src="' + Selectvalue + "' alt='Image'>"; }