myInput

Question

编辑：不是超时，它应该在2秒后激活。否则它会干扰焦点脚本上的滚动。

我这里有这个脚本，但希望超时1或2秒。

document.addEventListener("scroll", function() {
  document.activeElement.blur();
});

不应该有即时模糊，否则我的'焦点输入滚动'将无效。有人可以帮忙吗？谢谢。

$("#myInput").click(function () {
$("html, body").animate({ scrollTop: $("#osb").offset().top }, 300);
return true;

}）;

    		<div id="osb">
	<div id="osb01">
<input type="text" id="myInput" placeholder="Search.." title="Search">
</div>
</div>

Answer 1

使用setTimeout

document.addEventListener("scroll", function() {
    setTimeout( function(){ document.activeElement.blur() }, 1000 ); //1000 milliseconds
});

修改

由于您不想使搜索栏散焦，请检查当前活动元素是否不是搜索栏

document.addEventListener("scroll", function() { if ( document.activeElement.id == "myInput" ) //assuming that search bar id is myInput { setTimeout( function(){ document.activeElement.blur() }, 1000 ); //1000 milliseconds } });

myInput

Answer 2

gurvinder32对，但有更好的方法来做到这一点。

＆＃13;

document.onscroll = function() {
  var active = document.activeElement;
  setTimeout(function() {
    active.blur();
  }, 1000);
}

＆＃13;

body {
  height: 1000px;
  font-size: 24px;
  background: black;
  padding: 8px;
  margin: 0;
}

input {
  width: 100%;
  outline: 5px solid green;
}

＆＃13;

<input value="test1">
<input value="test2">
<input value="test3">
<input value="test4">
<input value="test5">
<input value="test6">
<input value="test7">
<input value="test8">
<input value="test9">
<input value="test10">

＆＃13;

此方法会在超时前记住活动元素，因此如果用户在超时之前更改焦点，那么旧元素blurs，则不会发生任何变化。

如何在1秒后激活此脚本？

2 个答案:

myInput