2017-03-16 13 views
0

私はこのようなフォームフィールドを持っています。ユーザーは5秒後に非アクティブであるときフォームフィールドによるタイムアウト処理

<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> 

今私は、ヘルプ情報を(後のdiv通知)例えば、アラートを発生させます。このコードでの作業:

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

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

myTimeout; 
</script> 

ユーザーが各入力フィールドをクリックすると、タイムアウトがクリアされています。

私の藤堂今

延長として、今、私の意図は、ユーザーの停止が入力フィールドに記入または10秒後に、その後の何も行いませんときに、同じアラートをプッシュすることです。私はそれをどのように実装できるのか分かりません。私はサポートを願っています。初心者のおかげです。

+0

要素に 'focus'があり、値が空であることを確認してください! – Rayon

答えて

0

以下のスニペットを見てみましょう:ユーザーが任意のコンテンツを入力しない場合には相互作用が停止したときに警告した後、ユーザーがフォームを埋めるために開始したときにそれを検出

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秒以内にフォームのフィールド。ユーザーが入力を停止しない場合、タイマーは更新され続けます。しかし、私はそれがあなたの希望する相互作用の状況をすべて保持しているかどうかはわかりません。

関連する問題