我在使用JQueryUI DatePicker在类的一组元素之间循环时遇到问题，由于控制台只是告诉我一个元素（未定义）是不确定的，因此我似乎无法弄清楚问题出在哪里。 / p>

$(document).ready(function () {
        $('.date').toArray().forEach(function (field) {

            $(field).datepicker({
                showOn: '',dateFormat: 'yy-mm-dd',changeMonth: true,changeYear: true,yearRange: "c-100:c+100",beforeShow: function () {
                    setTimeout(function () {
                        $(field).css('z-index',999999);
                    },0);
                }
            });

            let class_to_use = '.'+$(field).attr('id');

            let icon = $(class_to_use);
            console.log(icon); // fine,not undefined,it is the correct element
            icon.click(function () {
                console.log('clicked'); 
                $(field).datepicker("show")
                // but on click I get...
                // Uncaught TypeError: Cannot read property 'left' of undefined
             });
        });

    });

此输入是否为模态，这是我做错了吗？

这是为其中一个元素呈现的HTML，其中有多个是我进行循环的原因：

<i class="id_date fa fa-calendar-alt prefix prefix-smaller form-icon-adjust" style="cursor: pointer; color: var(--sidebar-bg-color)"></i>
<div class="md-form form-icon-margin ">

<input type="text" name="date" class="form-control date" required id="id_date">