He creado una página HTML local y puedo realizar cambios en el área de texto con la función de evaluación de JavaScript.
Todo funciona bien, pero cuando hago clic en el botón de cambio de color, cambia el color de las words en todo el área de texto.
Solo quiero cambiar el color de las words escritas después de presionar el botón. Como editores de texto enriquecido.
¿Alguna idea sobre eso?
//this is script functions and working fine
<html>
<head>
<meta charset="utf-8">
<style>
#textarea {
background-color: #000000;
color: #666666;
padding: 1em;
border-radius: 10px;
border: 2px solid transparent;
outline: none;
font-family: "Heebo", sans-serif;
font-weight: 500;
font-size: 16px;
line-height: 1.4;
width: 200px;
height: 233px;
}
#textarea:hover {
cursor: pointer;
background-color: #eeeeee;
}
#textarea:focus {
cursor: text;
color: #111111;
background-color: #334455;
border-color: #333333;
}
</style>
</head>
<body>
<textarea id="textarea" placeholder="Enter a message..."></textarea>
<script>
function changeBackgroundColor(colorText) {
document.body.style.background = colorText;
}
function changeTextColor() {
var element = document.getElementById("textarea")
element.style.color = "#FF0000";
}
</script>
</body>
y esta es la función WKWebView:
evaluateJavaScript("changeTextColor()", completionHandler: nil)