자바 스크립트 스톱워치 MySQL 데이터베이스

Question

그래서 내가하고 싶은 것은 내가 만드는 html 페이지에서 시작 시간과 종료 시간을 갖는 것입니다. 기술자가 작업을 시작하면 기술자가 시계를 시작할 수 있도록하고, 그날이 끝나면 멈추고 경과 된 총 시간을 계산합니다. 이제이 작업을 수행 할 코드를 찾았지만 한 걸음 더 나아가 야합니다. 시간이 경과하고 PHP 파일을 통해 POST해야 MySQL 데이터베이스에 만들어진 테이블에 저장됩니다.

<script type="text/javascript"> 
var duration = 0; 

// Javascript to compute elapsed time between "Start" and "Finish" button clicks 
function timestamp_class(this_current_time, this_start_time, this_end_time, this_time_difference) { 
     this.this_current_time = this_current_time; 
     this.this_start_time = this_start_time; 
     this.this_end_time = this_end_time; 
     this.this_time_difference = this_time_difference; 
     this.GetCurrentTime = GetCurrentTime; 
     this.StartTiming = StartTiming; 
     this.EndTiming = EndTiming; 
    } 

    //Get current time from date timestamp 
    function GetCurrentTime() { 
    var my_current_timestamp; 
     my_current_timestamp = new Date();    //stamp current date & time 
     return my_current_timestamp.getTime(); 
     } 

    //Stamp current time as start time and reset display textbox 
    function StartTiming() { 
     this.this_start_time = GetCurrentTime();  //stamp current time 
     document.TimeDisplayForm.TimeDisplayBox.value = 0;  //init textbox display to zero 
     } 

    //Stamp current time as stop time, compute elapsed time difference and display in textbox 
    function EndTiming() { 
     this.this_end_time = GetCurrentTime();   //stamp current time 
     this.this_time_difference = (this.this_end_time - this.this_start_time)/1000; //compute elapsed time 
     document.TimeDisplayForm.TimeDisplayBox.value = this.this_time_difference;  //set elapsed time in display box 
     } 

var time_object = new timestamp_class(0, 0, 0, 0); //create new time object and initialize it 

//--> 

function assignDuration() 
{ 
    document.stopform.duration.value = duration; 
} 
</script> 

    <form> 
     <input type="button" value="Start" onClick="time_object.StartTiming()"; name="StartButton"> 
    </form> 
    <form> 
     <input type="button" value="Finish" onClick="time_object.EndTiming()"; name="EndButton"> 
    </form> 

<form name="stopform" action="process-form.php" method="POST"> 
    <input type="hidden" name="duration" value="0"/> 
    <input type="submit" name="dostop" onClick="assignDuration()" value="Stop"/> 
</form> 

감사합니다.

Answer 1

JavaScript가 활성화되어 있으면 숨겨진 양식 요소를 만들고 사용자가 '중지'를 클릭 할 때 계산 된 기간을 할당 할 수 있습니다. 이 자체는 제출 버튼이어야합니다.

그래서 자바 스크립트는 다음과 같이 될 것입니다 :

<script type="text/javascript"> 
var duration = 0; 
...YOUR TIME CALCULATION CODE... 

function assignDuration() 
{ 
    document.stopform.duration.value = duration; 
} 

</script> 

그리고 당신의 HTML도있을 것이다 :

:

<form name="stopform" action="process-stop.php" method="POST"> 
    <input type="hidden" name="duration" value="0"/> 
    <input type="submit" name="dostop" onClick="assignDuration()" value="Stop"/> 
</form> 

는 또한 기간 값을 처리하는 PHP 파일이 필요합니다

$duration = $_POST['duration']; 
mysql_query('INSERT INTO MyTable (duration, technician) VALUES ('.$duration.', '.$technicianId.')'); 

위의 코드는 이미 사용자를 식별 할 수있는 수단이 있다고 가정합니다.

레코드의 경우 서버에 시작 시간과 종료 시간을 기록한 다음 그 기간을 계산하는 것에 대한 이전 의견에 동의합니다. 이미 말했듯이 클라이언트 측에서이 문제는 사용자가 JavaScript 코드 또는 시스템 시간과 날짜를 조작하여 데이터를 변경할 수 있다는 점에서 문제가됩니다. 또한 JavaScript가 활성화되어 있지 않으면 타이머 기능이 전혀 작동하지 않습니다.

JavaScript가 항상 사용 가능하고 사용자가이를 조작하지 않는다고 확신하는 경우 위의 해결책 (또는 이와 유사한 방식)이 효과가 있습니다.

P. 자바 스크립트와 PHP 구문을 두 번 확인해야 할 수도 있습니다. 필자가 머리 꼭대기에 입력 했으므로 코드 편집기에서 보지 못했습니다.