时间戳

首页 > 解决方案 > 使用 jQuery 在 HTML 元素后检查空

jquery - 使用 jQuery 在 HTML 元素后检查空

问题描述

我使用.after()如下形式进行表单验证

$("#contactNum").after(
    '<span class="invalid-feedback">Please fill up this Field.</span>'
);

我想检查它span是否存在以避免添加span两次。

标签： jquery

解决方案

您可以检查您之后的下一个元素contactNum是否没有特定的类，即invalid-feedback使用此添加您的跨度标签。

演示代码：

//using class
if (!$("#contactNum").next().hasClass("invalid-feedback")) {
  $("#contactNum").after(
    '<span class="invalid-feedback">Please fill up this Field.</span>'
  );
}
/*
//using text
if ($("#contactNum").next().text().trim() != "Please fill up this Field.".trim()) {
  $("#contactNum").after(
    '<span class="invalid-feedback">Please fill up this Field.</span>'
  );
}*/
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" id="contactNum">
<span class="invalid-feedback">Please fill up this Field.</span>

推荐阅读