HOMEJavaScript【JavaScript】ページ表示からフォーム送信までの経過時間を取得する【JavaScript】ページ表示からフォーム送信までの経過時間を取得する2022.01.13JavaScriptBこんにちは、ryohei(@ityryohei)です!本記事では、JavaScriptでページ表示からフォーム送信までの経過時間を取得する方法をご紹介しています。JavaScriptでページが表示されてからフォームが送信されるまでの経過時間を取得したいな。良い方法ないかな?上記の疑問にお答えします。ページ表示からフォーム送信までの経過時間の取得方法JavaScriptでページが表示されてからフォームが送信されるまでの時間(submitされるまでの時間)は下記のイベントプロパティで取得することができます。submitEvent.timeStamp戻り値はミリ秒単位のタイムスタンプです。1秒=1000ミリ秒となります。ミリ秒だと扱いずらいな...秒に変換したいな...という場合は1000で除算し、小数点以下を切り捨ててご使用ください。参考:https://developer.mozilla.org/ja/docs/Web/API/Event/timeStampページ表示からフォーム送信までの経過時間を取得するページ表示からフォーム送信までの経過時間を取得してみます。ここではsubmitEvent.timeStampで取得したタイムスタンプ値をp要素のテキストコンテンツに表示してみます。デモを用意していますので、取得したタイムスタンプの値とフォームの動作を確認してみてくださいね。CodePen.最後にページが表示されてからフォームが送信されるまでの経過時間を取得することで、ユーザーがページに訪問してから送信するまでのおおよその滞在時間がわかるようになります。それがフォームだけのページであればユーザーが入力にかかった時間を測ることができます。長く時間がかかっているようであれば入力項目を減らしたり、より使いやすいフォームに改善する目安になります。経過時間はsubmitEvent.timeStampで取得することができますので、フォーム構築で活用していきましょう!以上、JavaScriptでページ表示からフォーム送信までの経過時間を取得する方法のご紹介でした!JavaScriptを基礎からしっかりと学びたい方へ下記の参考書がおすすめです。私がJavaScript入門時に購入した書籍で、基礎から応用まで多様なサンプルを用いて解説されています。ページ数は多いですが、内容が伴っているのですらすら読めます。腰を据えて学びたい方に最良の一冊となっています。CC)はAdobe社が提供するクリエイター向けのサービスです。Effects」など全20以上のアプリが提供されており、幅広いプランが用意されています。CCの全20以上のアプリが使用できるプランです。コンプリートプラン(12ヵ月)」がセットになって39,980円(税込)で利用できます。Cloudのライセンスを購入でき、以降のライセンス更新も可能。動画教材で基礎スキルを習得できるので、入門する方にも便利な講座です。詳しくは下記のリンクからチェックしてみてくださいね。Webエンジニア福岡のWeb制作会社でエンジニアをしています。記事に関するご質問やご相談等ございましたら気軽にお問い合わせください。サービス・ツールSPEEC登録不要、無料で使えるビジネス書類作成サービスです。見積書~領収書までのPDFを一括で作成することができます。犬のごはん楽天市場で販売中の犬のごはんを好みの条件で簡単に絞り込むことができるドッグフード検索サイトです。HASHWordPressのログイン用にハッシュ化したパスワードを生成するツールです。DBからパスワードを変更する場合にご利用ください。Programご訪問いただきありがとうございます!本サイトを運営しているryoheiと申します。福岡のWeb制作会社でエンジニアをしています。本サイトは私が業務中に得た知識をアウトプットする場として2015年から運営しています。into-the-program.com。