表单域的超时处理

Question

我有一个像这样的表单域。现在

<form action="/action_page.php"> 
    First name: <input type="text" name="fname"><br> 
    Last name: <input type="text" name="lname"><br> 
    Title: <input type="text" name="title"><br> 
    Your Message: <textarea rows="4" cols="50"></textarea><br> 
    <input type="submit" value="Submit"> 
</form> 

当用户在5秒钟后不活动，我将会触发例如有帮助的信息警报（后一个div通知）。所以此工作与此代码：

<script> 
$("#contact input").on("click",function(){ 
    clearTimeout(myTimeout); 
}); 

var myTimeout = setTimeout(function(){ 
    alert("How can i help you"); 
}, 5000); 

myTimeout; 
</script> 

当用户在每个输入字段中单击时，超时已清除。

我的待办事项现在

为延长，现在我的本意是推动相同的警报，当用户停止填写输入域或什么都不做10秒后，随后的。我不知道如何实现它。我希望得到支持。感谢一位新手。

Answer 1

看看下面的代码片段：

var _formFillTimeout = null, 
 
    formFillTimeout = function() { 
 
     if (_formFillTimeout) window.clearTimeout(_formFillTimeout); 
 
     
 
     _formFillTimeout = window.setTimeout(function() { 
 
     window.alert("Don't stop filling the form!"); 
 
     }, 10000); 
 
    }; 
 
    
 
$("form").on("keyup", "input, textarea", formFillTimeout);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form action="/action_page.php"> 
 
    First name: <input type="text" name="fname"><br> 
 
    Last name: <input type="text" name="lname"><br> 
 
    Title: <input type="text" name="title"><br> 
 
    Your Message: <textarea rows="4" cols="50"></textarea><br> 
 
    <input type="submit" value="Submit"> 
 
</form>

当用户开始填写表格，它可以检测，然后发出警报时的相互作用，如果用户不输入任何内容停止表单的字段在10秒内。如果用户不停止输入，定时器将不断刷新。但我不确定它是否包含您所需的所有交互情况。