部分代码未触发 focusout 事件

Question

我希望在具有 class="date" 的输入元素上触发 focusout 事件并驻留在具有 class='datatable' 的表中DOM 和动态添加的元素。对于动态添加的元素（使用 createElement 和 appendChild），以下代码成功运行：

$('.datatable').on('focusout','tr td input', function(){
    if (this.class == 'date') {
        this.value = dateValid(this.value);
    }
});

但是，对于加载到 DOM 中的元素，上述代码不起作用。我也尝试了下面的代码，但它也不起作用：

$('.date').focusout(dateValid(this.value));

未触发 focusout 事件的输入元素 HTML：

<table class="datatable">
    <tr>
        <td>Prospective Effective Date</td>
        <td><input class="date" type="text" name="effectivedate"></td>
    </tr>
    <tr>
        <td>Prospective Expiration Date</td>
        <td><input class="date" type="text" name="expirationdate"></td>
    </tr>
</table>

我是 JavaScript 的新手，非常感谢您的帮助！

Answer 1

我认为问题出在保留关键字 "class":

if (this.class == 'date') {
 //...
}

使用className

if (this.className === 'date') {
 //...
}

如果这不能解决问题。您可能会在现有 table 中附加额外的 table.datatable 元素而不是 tr 元素。您可以通过将 focusout 绑定到 document

来解决这个问题

$(document).on('focusout','input.date', function(){
 //...
});

部分代码未触发 focusout 事件

focusout event not being triggered on part of the code

javascript

jquery

focusout