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.

Schreibe einen Kommentar