Javascript Chrome自动填充值无法在jQuery中反映

我有以下非常简单的表格：

<form action="goto.html" method="post" validate>
            <input type="text" name="username"  required>
            <br/>
            <input type="password" name="password" required>
            <br/>
            <button type="submit">submit</button>
 </form>  

我没有任何价值，甚至尝试了以下方法：

setInterval( function(){
        console.log('value is ::-')      
        console.log($('[name="username"]').val())      
    }, 500 );

除非您在浏览器内单击，否则该值将不会显示，单击后将在控制台中输出正确的值

即使我人工触发了这样的点击：

setTimeout( function() {
        $('body')
            .trigger('click');
    } , 3000 );

setInterval仍将记录空白，除非我实际在浏览器中单击

---

有解决办法吗？发现了一个类似的问题，但所提到的解决方案不起作用。

存在一个我不久前发现的黑客解决方案，但我不记得在哪里。 这是因为Javascript能够在Chrome中跟踪自动填充CSS动画

CSS部分：

@keyframes onAutoFillStart {  from {/**/}  to {/**/}}
@keyframes onAutoFillCancel {  from {/**/}  to {/**/}}

.my-input:-webkit-autofill {
    animation-name: onAutoFillStart;
    /* VERY slow dummy animation --> */
    transition: background-color 50000s ease-in-out 0s;
}
.my-input:not(:-webkit-autofill) {
    animation-name: onAutoFillCancel;
}

Javascript/JQuery部分：

$(document).on('animationstart', '.my-input', function(event) {
    var input = $(event.target).closest('.my-input');
    switch(event.originalEvent.animationName) {
        case 'onAutoFillStart':
            console.log(input.val());
            // ... do some other stuff
            break;   
        case 'onAutoFillCancel':
            if(input.val() == '') {
                console.log(input.val());
                // ... do some other stuff
            }
    }
});

---

[编辑]我在这里找到了原始源代码

使用

val（）

而不是

text（）

。不清楚为什么会在Chrome中出现这种情况，很可能是因为

text（）

并不是从get Go中提取输入字段值的标准方法。为什么要使用.text（），try.val（）

。text（）

返回元素之间的文本值。而不是输入字段的值。我真的很惊讶，它在点击..@AbanaClara后返回了您期望的结果，这不是bug

text（）

与

val（）

完全不同。而且，如果我没有弄错的话，Chrome实际上不会在页面加载时填充它们。它只向用户“显示”值，并等待用户交互以确认是否填写这些值。至少当一个站点需要我的地址数据时，它对我来说就是这样。我很好奇这是否解决了这个问题。如果是的话，干得好@Benni，如果在单击处理程序中我添加了一个警报（），我得到的是警报，但不是

.val（）

，它仍然是空的！一些非常奇怪的行为

$(document).on('animationstart', '.my-input', function(event) {
    var input = $(event.target).closest('.my-input');
    switch(event.originalEvent.animationName) {
        case 'onAutoFillStart':
            console.log(input.val());
            // ... do some other stuff
            break;   
        case 'onAutoFillCancel':
            if(input.val() == '') {
                console.log(input.val());
                // ... do some other stuff
            }
    }
});