表單驗證無法在jQuery中使用

Question

我正在嘗試使用jQuery進行表單驗證，但是它無法按照我的方式進行。 如果我對焦時輸入區域為空，我希望輸入的邊框變為紅色。

要么

我想添加一個名為“ has-danger”的引導程序類，如果輸入區域為空，它將使邊框和背景變為紅色。

這是代碼：

<fieldset class="form-group"> <br>
    <label for="name">Name</label> <br><br>
    <input type="name" class="form-control" id="name"> <br>
</fieldset>

jQuery代碼1：

$("#name").blur(function() {
    if((this).val() == "" ) {
        $(this).addClass("has-danger");
    }
});

jQuery代碼2：

$("#name").blur(function() {
    if((this).val() == "" ) {
        $(this).css("border", "solid 1px red");
    }

Answer 1

您在if語句中(this)之前缺少$

注意：我添加了一個else用於填充字段時刪除border

 $("#name").blur(function() { if ($(this).val() == "") { $(this).css("border", "solid 1px red"); } else { $(this).css("border", ""); } }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <fieldset class="form-group"> <label for="name">Name</label> <input type="name" class="form-control" id="name"> </fieldset>