• Empleos
  • Sobre nosotros
  • profesionales
    • Inicio
    • Empleos
    • Cursos y retos
  • empresas
    • Inicio
    • Publicar vacante
    • Nuestro proceso
    • Precios
    • Evaluaciones
    • Nómina
    • Blog
    • Comercial
    • Calculadora de salario

0

182
Vistas
Estoy tratando de mostrar una cita después de escribir el nombre del autor en el cuadro de texto, pero por alguna razón no muestra nada. ¿Cómo debo arreglar esto?

No estoy definido cuando escribo el nombre del autor en el cuadro de texto y presiono el botón para mostrar la cita. Parece que mi botón y el cuadro de texto no están vinculados entre sí. ¿Cómo puedo arreglar esto?

 <!DOCTYPE html> <html lang="en"> <head> <title>Quotes</title> </head> <body> <label for="getQuotes">Find Quotes (Type Author Name)</label><br> <input type = "text" id="getQuotes" name="getQuotes" placeholder="Search" style="margin:10px" size="50"/><br /> <button id="FetchQuotes" onclick="getQuote()" style="margin:10px">Fetch Quotes</button> <p id="quotes"></p> <p id="author"></p> <script> async function getQuote() { //const author = Boolean(false); let url = 'https://jaw1042-motivate.azurewebsites.net/quote'; let author = document.getElementById('getQuotes').value; if(author) { url = 'https://jaw1042-motivate.azurewebsites.net/quote?author= '; console.log(url + author); } else { console.log(url); } fetch(url) .then(async (response) => { if (response.ok) { console.log("Response code: " + response.status); } else if (response.status === 400) { console.log("Unable to find any quotes by specified author: " + response.status); } else { console.log("No quotes have been loaded: " + response.status); } const val = await response.json(); console.log(val); }).then(data => { document.getElementById('quotes').value = data; document.getElementById('author').value = data; console.log(data); alert(data); }); } </script> </body> </html>
about 3 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

sus funciones then no son correctas en el resultado directo de fetchAPI, puede recibir datos y para usarlos necesita ejecutar .json() o .text() en él, no puede simplemente usar ese resultado o devolver su valor ( Además, cuando use la declaración de devolución, todos sus próximos códigos serán inalcanzables) después de eso, no debe asignar algo a su variable de data porque solo tiene nuevos datos obtenidos del backend, al asignar un nuevo valor a los datos, está a punto de arruinar nuevos datos

así es como debería verse tu js

 function getQuote() { fetch("https://krv1022-motivate.azurewebsites.net/quote") .then( res => res.text() ) .then( data => { document.querySelector(".quote").value = data; } ); }

También le proporcioné un violín, pero no puede recibir datos porque su URL no es correcta o hay problemas de CORS

==============================================

Una cosa que acabo de notar es que está recibiendo el nombre del autor del usuario final, ¡pero no está a punto de enviarlo al backend!

entonces quizás este código sea más completo, asumo que desea enviar datos usando el método GET y el backend quiere que el nombre del autor se llame getQuotes

about 3 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Nuestro proceso Comercial
Legal
Términos y condiciones Política de privacidad
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recomiéndame algunas ofertas
Necesito ayuda