使用JQuery创建它们之后,JQuery $(" .some-element-id")。length返回0

时间:2017-06-28 16:29:55

标签: jquery html css forms validation

所以我有一个focusout事件绑定到一个输入字段,该字段使用带有类名的JQuery创建一个div元素。在创建此div并在输入字段之后添加之前,我正在检查是否存在任何此类元素,如果是,则删除它们。这是我的代码:

$("#client-first-name").focusout(function() {


        var test = $(".field-validation-message").length;
        //remove all previous error divs
        if($(".field-validation-message").length) {
            $(".field-validation-message").remove();
        }


        if(checkName("client-first-name") != "") {
            $("#client-first-name").after($('<div />', {
                class: '.field-validation-message',
            }).html('test'));
        }
    });

函数checkName只检查输入字段中是否有任何错误。测试变量始终为0(使用DevTools检查)。

任何想法?

2 个答案:

答案 0 :(得分:1)

您唯一的问题是您要添加到新div的课程不应该加上.

$("#client-first-name").focusout(function() {


  var test = $(".field-validation-message").length;
  console.log(test);
  //remove all previous error divs
  if ($(".field-validation-message").length) {
    $(".field-validation-message").remove();
  }


  if (checkName("client-first-name") != "") {
    $("#client-first-name").after($('<div />', {
      class: 'field-validation-message',  //here was the problem!!
    }).html('test'));
  }
});

function checkName(selector) {
  return "no way";
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id='client-first-name'>

答案 1 :(得分:0)

为什么不在每次模糊时删除$(".field-validation-message")

$("#client-first-name").focusout(function() {
        $(".field-validation-message").remove();

        if(checkName("client-first-name") != "") {
            // Or here if you only want to remove when appending 
            // $(".field-validation-message").remove();

            $("#client-first-name").after($('<div />', {
                class: '.field-validation-message',
            }).html('test'));
        }
});