Javascript 基于动态元素的Bootstrap验证

我有一个输入元素（EngVDCategory），它附带了一个span addbutton（+）。单击span（+），将向元素（EngVDCategory2）追加一个附加元素。这样，用户可以动态添加更多输入。这是用append完成的。 这里的问题是引导只验证已经定义的元素，而不验证动态添加的输入元素。如何验证新添加的元素

我的HTML

<div class="VDGroup">
          <div class="VDGroupPlaceHolder">
             <div class="form-group">
                <label class="col-md-4 control-label">Engineering and Vendor data</label>
                <div class="col-md-4 inputGroupContainer">
                   <div class="input-group">
                      <input type="text" id="EngVDCategory" name="EngVDCategory" placeholder="Engineering and Vendor data" class="form-control">
                      <span class="input-group-addon cursor" id='addButton'><i class="glyphicon glyphicon-plus "  ></i></span>
                      <span class="input-group-addon cursor" id='removeButton'><i class="glyphicon glyphicon-minus" ></i></span>
                   </div>
                </div>
             </div>
          </div>
       </div>

JS动态追加输入元素

$("#addButton").click(function () {
                  if( ($('.VDGroup .VDGroupPlaceHolder').length+1) > 5) {
                      alert("Only maximum of 5 Categories are allowed");
                      return false;
                  }
                  var id = ($('.VDGroup .VDGroupPlaceHolder').length + 1).toString();
                  $('.VDGroup').append('<div class="VDGroupPlaceHolder"><div class="form-group"><label class="col-md-4 control-label">Engineering and Vendor data</label><div class="col-md-4 inputGroupContainer"><input type="text" id="EngVDCategory' + id + '" name="EngVDCategory' + id + '" placeholder="Engineering and Vendor data ' + id + '" class="form-control" ></div></div></div>');
                 // validator.addField($(this));
              });

$（“#添加按钮”）。单击（函数（）{
如果（$（'.VDGroup.VDGroupPlaceHolder'）.length+1）>5）{
警报（“最多允许5类”）；
返回false；
}
变量id=（$（'.VDGroup.VDGroupPlaceHolder'）.length+1.toString（）；
$（'.VDGroup'）。追加（'Engineering and Vendor data'）；
//addField（$（this））；
});

仅对初始定义的元素而不是附加的元素进行验证的屏幕截图

---

这有帮助吗？不，因为这更多的是与控制放置有关，而不是验证本身。

$("#addButton").click(function () {
                  if( ($('.VDGroup .VDGroupPlaceHolder').length+1) > 5) {
                      alert("Only maximum of 5 Categories are allowed");
                      return false;
                  }
                  var id = ($('.VDGroup .VDGroupPlaceHolder').length + 1).toString();
                  $('.VDGroup').append('<div class="VDGroupPlaceHolder"><div class="form-group"><label class="col-md-4 control-label">Engineering and Vendor data</label><div class="col-md-4 inputGroupContainer"><input type="text" id="EngVDCategory' + id + '" name="EngVDCategory' + id + '" placeholder="Engineering and Vendor data ' + id + '" class="form-control" ></div></div></div>');
                 // validator.addField($(this));
              });