Ich habe ein Textfeld mit gefülltem Wert. Es enthält 'XXXX' und ich möchte nur 'XXXX' hervorheben, damit der Benutzer bemerken kann, dass XXXX durch einen Wert ersetzt werden muss. Wie kann ich den Wert bekommen, nehme nur die 'XXXX' und ersetze sie mit dem gleichen Wert, aber farbig.Text im Textfeld durch farbigen Text ersetzen, jquery
können Sie Div Element verwenden:
<html>
<title>This is test</title>
<head>
<style>
.highlight {
background-color: yellow;
}
div {
-moz-appearance: textfield;
-webkit-appearance: textfield;
background-color: white;
background-color: -moz-field;
border: 1px solid darkgray;
box-shadow: 1px 1px 1px 0 lightgray inset;
font: -moz-field;
font: -webkit-small-control;
margin-top: 5px;
padding: 2px 3px;
width: 398px;
}
</style>
</head>
<body>
<div class="txt" contenteditable="true"> I am XXXX.</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(document).ready(function(){
$txt = $(".txt").text();
$newTxt = $txt.replace(/XXXX/gi,"<span class=highlight>XXXX</span>");
$(".txt").html($newTxt);
})
</script>
</body>
</html>Beachten Sie, dass dies im IE ab der [Kompatibilitätsseite] (http://caniuse.com/#feat=css-appearance) nicht unterstützt wird! – dude
Mögliche Duplikat [? Gibt es eine Möglichkeit, um Stil Teil eines Wertes des Eingabefeldes] (http://stackoverflow.com/questions/3121683/is-there-a-way-to-style-Teil eines Eingabefeldes-Wert) – Dekel
okay. Gibt es eine gute Möglichkeit, das Textfeld hervorzuheben, damit der Benutzer es bemerkt? ich möchte nicht einen Stern am Ende des Textfelds verwenden oder den Hintergrund färben. – moody
Sie können keine css-Eigenschaft für einen Teil des Textfeldes festlegen. Sie können stattdessen das Attribut 'div' oder' p' verwenden, das das Attribut 'contenteditable' hat. – Mohammad