Actualmente estoy tratando de crear un programa de búsqueda y reemplazo usando expresiones regulares en JavaScript, pero sigo recibiendo el siguiente error cuando hago clic en el botón "ir", que se supone que busca y reemplaza la cadena dada, aunque actualmente todo lo que hago es Estoy tratando de hacer es imprimir la cadena encontrada en la consola:
Uncaught TypeError: projected.value is undefined
Aquí está el código:
<body> <textarea name="input" id="inputText" cols="30" rows="10"> </textarea> <p id="projectedText"></p> <label for="find">Find: </label> <input type="text" id="find"> <label for="replace">Replace: </label> <input type="text" name="" id="replace"> <input type="button" value="Go" id="commit"> </body> document.getElementById("commit").onclick=findNreplace; //set up go button //variables var textToShow = document.getElementById("inputText"); var projected = document.getElementById("projectedText"); var toFind = document.getElementById("find").value; var toReplace = document.getElementById("replace").value; // set up text area to project the input into the paragraph textToShow.addEventListener('input',updateValue); function updateValue(text) { projected.textContent=text.target.value; } // replace function function findNreplace() { var regex = /toFind/; var found = projected.value.match(regex); console.log(found); }¿Qué me estoy perdiendo?
El elemento <p> no tiene una propiedad de valor, pero puede acceder a su valor de la misma manera que lo actualizó con la propiedad textContent .
Para hacer coincidir el valor de la entrada toFind en lugar de hacer coincidir exactamente la cadena "toFind", debe usar la variable en la expresión regular .
function findNreplace() { var regex = new RegExp(toFind, 'g'); var found = projected.textContent.match(regex); console.log(found); }También podría simplemente reutilizar el valor de entrada directamente:
function findNreplace() { var regex = new RegExp(toFind, 'g'); var found = textToShow.value.match(regex); console.log(found); }También deberá cambiar los selectores de elementos si tiene la intención de obtener el valor actual de las entradas en las funciones en lugar de solo obtener el valor inicial cuando se carga el script:
var toFind = document.getElementById("find"); var toReplace = document.getElementById("replace");Actualice la función para obtener el valor actual de la entrada cuando se llame:
function findNreplace() { var regex = new RegExp(toFind.value, 'g'); var found = textToShow.value.match(regex); console.log(found); }Al final de esta línea "var projected = document.getElementById("projectedText")" escriba .value