jQuery 日期选择器字形图标丢失

Question

在过去的几天里，我遇到了一个非常奇怪和奇怪的。我正在使用 jQuery 验证插件来验证我的字段，名为 "start date"。此字段有一个简单的验证方法，其中 required 设置为 true。我能够成功验证该字段。但是，我收到了一个奇怪的问题。当字段验证为有效或无效时，glyphicon-calendar icon 将神奇地消失。我试图通过查看检查器工具来排除故障，结果是这个日历图标代码在验证后 完全删除 。

  <span class="glyphicon glyphicon-calendar"></span>

我花了几个小时研究，但似乎没有人收到这个奇怪的问题。有谁知道为什么？ 非常需要帮助！这是我的问题和我当前代码的屏幕截图

 $(document).ready(function () {
        $.validator.setDefaults({
            highlight: function (element, errorClass, validClass) {
                if (element.type === "radio") {
                    this.findByName(element.name).addClass(errorClass).removeClass(validClass);
                } else {
                    $(element).closest('.form-group').removeClass('has-success').addClass('has-error has-feedback');
                    $(element).closest('.form-group').find('span.glyphicon').remove();
                    $(element).closest('.form-group').append('<span class="glyphicon glyphicon-remove form-control-feedback" aria-hidden="true"></span>');
                }
            },
            unhighlight: function (element, errorClass, validClass) {
                if (element.type === "radio") {
                    this.findByName(element.name).removeClass(errorClass).addClass(validClass);
                } else {
                    $(element).closest('.form-group').removeClass('has-error has-feedback').addClass('has-success has-feedback');
                    $(element).closest('.form-group').find('span.glyphicon').remove();
                    $(element).closest('.form-group').append('<span class="glyphicon glyphicon-ok form-control-feedback" aria-hidden="true"></span>');
                }
            }
        });

        $('#dataForm').validate({
            rules: {
                startDateInput: {
                    required: true
                }
            },
            submitHandler: function (form) {
                alert('success');
            }
        });
    });

<form id="dataForm" method="post" action="#">
<div class="form-group">
        <label class="control-label col-md-4" for="startDateInput">Start Date</label>
        <div class="input-group date" id="startDateInput" style="max-width: 280px" data-provide="datepicker">
            <input type="text" class="form-control" name="startDateInput">
            <div class="input-group-addon">
                <span class="glyphicon glyphicon-calendar"></span>
            </div>
        </div>
        <input type="submit" class="btn btn-primary" value="Save" id="saveButton" />
    </div>
</form>

演示：https://jsfiddle.net/Issaki1/gud7xjy0/10/

Answer 1

正如@Rich 在评论中提到的，以下行删除了图标。

$(element).closest('.form-group').find('span.glyphicon').remove();

jQuery 日期选择器字形图标丢失

jQuery date-picker glyphicon icon missing

javascript

jquery

jquery-validate