Mit JQuery um die Textfarbe zu ändern auf Wert-Eingang, wenn die Validierung fehlschlägt
Möchte ich einfach nur mein text in der Wert-Eingabe-Feld in rot ändern, wenn meine php-Validierung scheitert?
wie kann dies erreicht werden unter Verwendung von JQuery?
Hab ich es mit Javascript, außer jedes mal, wenn ich auf "submit" wird er rot und verschwindet dann wieder...
<form class="link-form" method="post" action="">
<label>DIRECT LINK</label>
<input type="text" id="url" name="url" value="<?php if(isset($_POST['url'])) { echo htmlspecialchars($_POST['url']); } ?>" />
<input class="btn-submit" type="submit" id="submit" name="submit" value="Generate Direct Link" />
<?php
$directLink = "";
$error = "";
$url = $_POST['url'];
if(isset($_POST['submit'])) {
$partsUrl = parse_url($url);
if ($partsUrl["scheme"] === "https://" && $partsUrl["host"] === "example.com/")
{
$key = substr($partsUrl["path"],8,-5);
$directLink = "https://example.com/".htmlspecialchars($key);
}
else
{
$error = "Invalid, Please insert the correct Link";
}
}
?>
<label>DIRECT LINK</label>
<input type="text" id="directLink" name="directLink" value="<?php if (!empty($directLink)) { echo $directLink; } else { echo $error; } ?>" />
</form>
function colorChange() {
var inputVal = document.getElementById("directLink").value;
if (inputVal === "Invalid, Please insert the correct Link") {
document.getElementById("directLink").style.backgroundColor = "red";
}
else
{
document.getElementById("directLink").style.backgroundColor = "black";
}
}
Oder ich habe versucht, das JQuery-Beispiel unten, aber Sie Taten nichts.
$('#submit').on('click',function(){
var text = $('#directLink').val();
if(text === 'Invalid, Please insert the correct Link'){
$('#directLink').css({'background-color':'red !important'});
}
});
- Sollten Sie die entsprechenden Teile des Skripts und HTML
- das ist das javascript, das ich verwendet, das funktioniert aber nur vorübergehend, nachdem ich es auf rot, dann wieder auf default Wert.
- First off, wenn Sie wollen, die Farbe des Textes zu ändern, dann ist es
style.color = "red";
- oh ja, ich weiß, so oder so erzeugt es den gleichen Effekt.
- Bitte ganzen code. Verwenden Sie ajax für das senden von Daten?
- Dort gehen Sie, Nein, ich bin nicht mit ajax, ich habe nie wirklich verwendet Ajax vor.
Du musst angemeldet sein, um einen Kommentar abzugeben.
Können Sie die jQuery -
css
Methode, umbackground-color
auf Ihre text-Feld wie diesesWenn Sie nur wollen, ändern Sie den text Farbe auf rot, sollten Sie
color
EigenschaftWenn Sie versuchen, verwenden Sie
red !important
ist, wird es einfach nicht ohne Fehler, denn jQuery hat ein problem, das Verständnis!important
. Wenn Sie wirklich brauchen, um zu verwenden, haben Sie einen Blick auf diese Problemumgehungen, aber in deinem Fall denke ich !wichtig ist wirklich nicht notwendig 🙂Paar weitere änderungen :-
Einreichen im Falle von Fehler-Szenarien
das nächste mal buchen Sie eine gültige url, directLink ist immer noch mit Fehler
Meldung und das Formular nicht vorgelegt bekommen.
Hier ein bin zu spielen.
background-color
nichtcolor
url
aber änderndirectLink
.. ist das deine Absicht ? überprüfen Sie den Wert von einem input-Feld im Formular, und markieren Sie einige andere box ?!important
. Sie sind eigentlich nicht zu verwenden, es sei denn, Sie Erben einige Stile, für die Sie nicht haben Zugang zu 🙂