jQuery的remove()函数不起作用，无法删除span标记

Question

这是我的函数，我正在使用它来检查数据库中是否存在相同的数据，然后会出现错误，并且应该输入一些其他数据

Jquery函数并没有删除以前的标记，而是在每次按键后继续添加Text。

$(document).ready(function() {
$("#id_emp_no").keyup(function() {
var emp_no = $(this).val();
if (emp_no != "") {
$.ajax({
url: "{% url 'check_emp_no_exist' %}",
type: 'POST',
data: {
emp_no: emp_no
}
})
.done(function(response) {
if (response == "True") {
$(".empno_error").remove();
$("<span class='emp_no_error' style='color: red; padding: 5px; font-weight: bold;'> Employee No Not Available. </span>").insertAfter("#id_emp_no")
} else {
$(".empno_error").remove();
$("<span class='emp_no' style='color: green; padding: 5px; font-weight: bold;'> Employee No Available. </span>").insertAfter("#id_emp_no")
}
})
// }) // removed this
} else {
$(".empno_error").remove();
}
})
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form-group">
<label for="id_emp_no">Empno:</label>
<input type="text" name="emp_no" class="form-control" maxlength="50" required="" id="id_emp_no">
</div>

Answer 1

更简单、更安全的

$(function() {
$("#id_emp_no").on("input", function() {
$(".emp_no").hide();
var emp_no = $(this).val();
if (emp_no.trim() === "") return; // stop
$.post("{% url 'check_emp_no_exist' %}", {emp_no: emp_no}, function(response) {
$(".emp_no.error").toggle(response === "True");
$(".emp_no.ok").toggle(response !== "True");
});
});
});

.emp_no {
padding: 5px;
font-weight: bold;
display: none;
}
.emp_no.error {
color: red;
}
emp_no.ok {
color: green;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form-group">
<label for="id_emp_no">Empno:</label>
<input type="text" name="emp_no" class="form-control" maxlength="50" required="" id="id_emp_no">
<span class='emp_no error'>Employee No Not Available.</span>
<span class='emp_no ok'>Employee No Available.</span>
</div>