Chrome 更新 73 - Materialise CSS JS 触发错误

Question

在最新的 Chrome 更新 73 之后，Materialize CSS 0.100.2 的日期选择器、时间选择器和下拉菜单不再起作用，当您单击它时它会闪烁然后消失。

知道如何解决这个问题吗？

Answer 1

我有同样的问题。现在我做了一些更改以使其正常工作（这对我来说只是一个临时热修复）。

关于 materialize.js（materialize-v0.100.2 不是最简单的）：

1) 在第 1786 行有一个等待值为 0 的 setTimeout（带有注释“将单击关闭处理程序添加到文档”），将其更改为 100。

2) 在第 6558 行，有一个绑定到 datepicker 元素外的点击。 （带有注释“绑定文档事件”。）将所有这些绑定放在等待时间为 500 毫秒的 setTimeout 中。

Fix 1 用于选择，第二个用于日期选择器。

Answer 2

这是 Chrome 73 中的回归。我们发布了 pickadate 3.6.1 应该可以解决这个问题。

请参阅 https://bugs.chromium.org/p/chromium/issues/detail?id=941910 了解 Chrome 中的回归。

Answer 3

para timepicker comentar los siguiente en materialize.js

/** Hide when clicking or tabbing on any element except the clock and input
    $doc.on('click.clockpicker.' + this.id + ' focusin.clockpicker.' + this.id, function (e) {
      var target = $(e.target);
      if (target.closest(self.popover.find('.picker__wrap')).length === 0 && target.closest(self.input).length === 0) {
        self.hide();
      }
    });*/

Answer 4

我在 chrome 中找到了一个修复，你只需要使用它 示例：$("#dtFrom").off("focus") 如果页面很慢，您需要放入 setTimeout 内，仅此而已

Answer 5

我遇到了同样的问题。虽然我使用的是angular2-materialize，但我相信这应该适用于直接使用materialize 的人。

对我有用的解决方案是用 div 包装具体化 select 输入，该 click 侦听器仅调用 event.stopPropagation()：

<div (click)="$event.stopPropagation()">
    <select materialize="material_select" [value]="selectValue" formControlName="someControl">
    // options omitted (not relevant to answer)
    </select>
</div>

我希望这对某些人有所帮助。

Answer 6

对于那些懒得自己调整 materialize.js 的人。我添加了 500 毫秒的默认超时（我认为它始终有效）。这适用于日期和时间选择器。

materialize.js

Answer 7

解决办法是用父级过滤目标： if ( target != ELEMENT && target != document && target != P.$root.parent()[0] && event.which != 3 )

Answer 8

基于 Armando 的回答（唯一一个对我有用的），我使用 JQuery 为非 Angular 项目制作了一个 javascript 函数：

function refreshSelects(){
    $('select').material_select('destroy');
    $('select').each(function(){
        $(this).parent().attr("onclick","event.stopPropagation();");
    });
    $('select').material_select();  
}

然后，当我必须初始化或刷新选择器内容时，我只需要调用函数

refreshSelects();