• ベストアンサー

ストップウォッチとその累計回数と累計時間

まったく解らないまま、仕事で必要になり困っています。 必要な機能:ストップウォッチと、1回毎の時間を残し、なおかつその累計累計時間が必要です。 ストップウォッチはHP参照に作成できましたが、ただのストップウォッチとしての機能のみ。 イメージ的には、 < ストップウオッチ  > ーーーーーーーーーーーーーーーーーーーーーーーー 1回目  5:00 2回目  6:00 3回目  7:00 合計   18:00 こんな感じで、ストップウォッチのログのようなものが吐き出しされなおかつ、その合計を出すのですが、これはjavaスクリプトだけで作成することは可能でしょうか?ご存知の方がいらっしゃればご指導いただけると幸いです。 形式は、まったく異なっても機能が利用できれば十分です。 よろしくお願いいたします。

質問者が選んだベストアンサー

  • ベストアンサー
noname#84373
noname#84373
回答No.3

<html> <body> Time:<input type="text" size="10" value="0:00" style="text-align:right" id="v0"> <input type="button" value="Start/Stop" onClick="movement()"> <input type="button" value="Posting↓" onClick="addlist()"> <hr/> <textarea id="v1" rows="10" cols="40"></textarea><br/> Total:<input type="text" size="10" style="text-align:right" id="v2"> <script> var t1=0; var t2=0; var tg=0; function movement(){ t1=t1?0:(new Date()).getTime();inc(); } function inc(){ if(t1){ setTimeout("inc()",1000); $('v0').value=$T(Math.floor(((new Date()).getTime()-t1)/1000));}} function $(o){ return document.getElementById(o); } function $V(o){ return $(o).value; } function $0NUM( num, p ){ var s = '0000000'+ num; return s.substr( s.length-p,p); } function $T(n){ return Math.floor(n/60)+':'+$0NUM(n%60,2)+' /'+n;} function addlist(){ $('v1').value+=($V('v1').split('\n')).length+'回目 '+$V('v0')+'\n'; $('v2').value=$T(tg+=($V('v0').split("/"))[1]-0); } </script> </body> </html>

cyaco3
質問者

お礼

pipiさん、ありがとうございまいました。 難しいスクリプトで内容の理解はできないのですが・・(^ ^;) 1回目・・2回目と、表示もされ見やすかったです。 助かりました。 pipiさん、urecyさん共にどうもありがとうございました。 おかげで仕事も仕上がりました。 またすぐに別の質問を載せると思います・・・多分今日、私も色々勉強しなければならないのですが、この場を頼りにしています。 ご機会あれば、またよろしくお願いいたします。

その他の回答 (3)

noname#84373
noname#84373
回答No.4

訂正! var=t2; は使われていないので消してください ”分:秒 /秒” の書式ですが、"/秒"が無いと面倒なので 勝手につけました。

cyaco3
質問者

お礼

どうもありがとうございました。 助かりました。

  • urecy
  • ベストアンサー率54% (30/55)
回答No.2

NO.1の者です。 ラップタイムがラップタイムになってなかったので修正しました。 見た目はしょぼいですが、こんな感じでしょうか? コピペして確認してみてください。 少しばかりタイムに誤差がでるようです。 (仕事で使われるようですが、正確さを必要とされる場合は 利用されないほうが良いと思います。 不祥事が起きても保障できませんので。) <html> <head> <title>STOP WATCH</title> <script type="text/javascript" > var flag = 0; function set() { if( flag == 0 ) { flag = 1; rap_count = 0; total_time = 0; document.getElementById('start_button').value = "STOP"; document.getElementById("view").innerHTML = ""; Start = new Date(); pre_time = new Date(); test = setInterval( timer, 1 ); }else{ clearInterval( test ); rap_time(); flag = 0; document.getElementById('start_button').value = "START"; document.getElementById("total_view").innerHTML = "TOTAL:" + document.getElementById('show_window').value; } } function timer() { Stop = new Date(); T = Stop.getTime() - Start.getTime(); H = Math.floor( T / ( 60 * 60 * 1000 ) ); if( H <= 9 ) { H = "0" + H; } T = T - ( H * 60 * 60 * 1000 ); M = Math.floor( T / ( 60 * 1000 ) ); if( M <= 9 ) { M = "0" + M; } T = T - ( M * 60 * 1000 ); S = Math.floor( T / 1000 ); if( S <= 9 ) { S = "0" + S; } Ms = T % 1000; document.getElementById('show_window').value = H + ":" + M + ":" + S + "." + Ms; } function rap_time() { if( flag == 1 ){ rap = new Date(); T = rap.getTime() - pre_time.getTime(); total_time = total_time + T; H = Math.floor( T / ( 60 * 60 * 1000 ) ); if( H <= 9 ) { H = "0" + H; } T = T - ( H * 60 * 60 * 1000 ); M = Math.floor( T / ( 60 * 1000 ) ); if( M <= 9 ) { M = "0" + M; } T = T - ( M * 60 * 1000 ); S = Math.floor( T / 1000 ); if( S <= 9 ) { S = "0" + S; } Ms = T % 1000; rap_count = rap_count + 1; newNode = document.createElement("p"); newNode.setAttribute( "id", "rap_count" + rap_count ); var newText = document.createTextNode( "RAP" + rap_count + ":" + H + ":" + M + ":" + S + "." + Ms ); newNode.appendChild( newText ); document.getElementById("view").appendChild( newNode ); pre_time = rap; } } </script> </head> <body> <input type="text" size="20" name="myClick" id="show_window" > <input type="button" value="START" name="start_button" id="start_button" onclick=" set(); "> <input type="button" value="RAP" onclick=" rap_time(); " > <hr> <p id="view" ></p> <hr> <p id="total_view">TOTAL:00:00:00.000</p> </body> </html>

cyaco3
質問者

お礼

ありがとうございました。 はい、ラップタイムが必要であのあと考えていただのですが、教えてもらったほうが良かったので、そちらで試してみました。 追加でお知らせいただきありがとうございました。

  • urecy
  • ベストアンサー率54% (30/55)
回答No.1

急ぎのようなので 満足いってませんがとりあえず書き込みをしてみました。 したの物をコピペして動作確認してみてください。 基本のストップウォッチは、ネットにあったものを利用させていただきました。 <html> <head> <title>STOP WATCH</title> <script type="text/javascript" > var rap_count = 0; var total_rap = 0; myButton = 0; function myWatch(flug) { if( myButton == 0 ){ myButton = 1; rap_count = 0; Start = new Date(); document.myForm.myFormButton.value = "Stop!"; myInterval = setInterval( "myWatch(1)", 1 ); document.getElementById("view").innerHTML = ""; } else { if( flug == 0 ){ clearInterval( myInterval ); myButton = 0 document.myForm.myFormButton.value = "Start"; rap_count = rap_count + 1; newNode = document.createElement("p"); newNode.setAttribute( "id", "rap_count" + rap_count ); var newText = document.createTextNode( "RAP" + rap_count + ":" + document.getElementById('show_window').value ); newNode.appendChild( newText ); document.getElementById("view").appendChild( newNode ); document.getElementById("total_view").innerHTML = "TOTAL:" + document.getElementById('show_window').value; } Stop = new Date(); T = Stop.getTime() - Start.getTime(); H = Math.floor(T/(60*60*1000)); T = T-(H*60*60*1000); M = Math.floor(T/(60*1000)); T = T-(M*60*1000); S = Math.floor(T/1000); Ms = T%1000; document.myForm.myClick.value = H + ":" + M + ":" + S + ":" + Ms; } } function rap() { rap_count = rap_count + 1; newNode = document.createElement("p"); newNode.setAttribute( "id", "rap_count" + rap_count ); var newText = document.createTextNode( "RAP" + rap_count + ":" + document.getElementById('show_window').value ); newNode.appendChild( newText ); document.getElementById("view").appendChild( newNode ); } </script> </head> <body> <form name="myForm" action="#"> <div> <input type="text" size="20" name="myClick" id="show_window" > <input type="button" value="Start" name="myFormButton" onclick="myWatch(0)"> <input type="button" value="Rap" onclick=" rap(); " > </div> </form> <hr> <p id="view" ></p> <hr> <p id="total_view">TOTAL:00:00:00.000</p> </body> </html>

cyaco3
質問者

お礼

ありがとうございます。 その日のうちに返信いただき、とても助かりました。

関連するQ&A