CodeLab
Show Output
 
xxxxxxxxxx
31
 
1
<!DOCTYPE html>
2
<html lang="en">
3
<head>
4
<meta charset="utf-8">
5
<title>Check If Input Text Box has Empty Value in jQuery</title>
6
<style>
7
    .error{
8
        outline: 1px solid red;
9
    }    
10
</style>
11
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
12
<script>
13
$(document).ready(function(){
14
    $('#myForm input[type="text"]').blur(function(){
15
        if(!$(this).val()){
16
            $(this).addClass("error");
17
        } else{
18
            $(this).removeClass("error");
19
        }
20
    });
21
});
22
</script>
23
</head>
24
<body>
25
    <form id="myForm">
26
        <p><label>First Name: <input type="text"></label></p>
27
        <p><label>Last Name: <input type="text"></label></p>
28
        <p><label>Email Address: <input type="text"></label></p>
29
    </form>
30
</body>
31
</html>
 

在微博、微信、公众号、小程序分享此示例。 如果您觉得有帮助,请给我们一个赞。