테스트 사이트 - 개발 중인 베타 버전입니다

select 박스로 시간을 입력받아 시간의 차이 계산하기 채택완료

임총 4년 전 조회 3,742

php파일로 제작하였고 대여 시작 시간과 대여 종료 시간을 입력받아 대여시간을 자동으로 구하려고 하는데 가능할까요?

댓글을 작성하려면 로그인이 필요합니다.

답변 5개

채택된 답변
+20 포인트
4년 전

해당 페이지에서 바로 보여주려는 경우에는 javascript 로 처리해야 됩니다.

 

</p>

<p><tr>

  <td> 대여 시작 시간 </td>

  <td> 대여 종료 시간 </td>

  <td> 대여 시간 </td>

</tr>

<tr>

  <td>

      <select name="StartTime" id="StartTime">

      <option value="">시작 시간을 선택하세요</option>

      <option value="1">2021-05-26 09:00:00</option>

      <option value="2">2021-05-26 10:00:00</option>

      <option value="3">2021-05-26 11:00:00</option>

      <option value="4">2021-05-26 12:00:00</option>

      <option value="5">2021-05-26 13:00:00</option>

      </select>

  </td>

  <td>

      <select name="EndTime" id="EndTime">

      <option value="">종료 시간을 선택하세요</option>

      <option value="1">2021-05-26 18:00:00</option>

      <option value="2">2021-05-26 19:00:00</option>

      <option value="3">2021-05-26 20:00:00</option>

      <option value="4">2021-05-26 21:00:00</option>

      <option value="5">2021-05-26 22:00:00</option>

      </select>

  </td>

  <td>

  <span id="s_hour"></span>

  </td>

</tr></p>

<p><script>

$(function() { 

    $('#StartTime, #EndTime').on('change', function() {

        var d1 = $('#StartTime').val();

        var d2 = $('#EndTime').val();

        

        if (date1 == '' || date2 == '')

            return false;

        

      var date1 = new Date(d1);

      var date2 = new Date(d2);

      

      var difference = Math.abs(date2.getTime() - date1.getTime());

      var hourDifference = difference  / 1000 / 3600;

      

      $('#s_hour').html(hourDifference);

    });

});

</script></p>

<p>

로그인 후 평가할 수 있습니다

답변에 대한 댓글 2개

임총
4년 전
아하 감사합니다 ㅠㅠㅠ 혹시 13시에서 18시까지 빌렸으면 대여시간에 7이 나타나도록 하려면 var hourDifference = difference / 1000 / 3600 / 60; 으로 해야하나요??
마르스컴퍼니
4년 전
대여시간에 7이 나타나도록 하려면 var hourDifference = difference / 1000 / 3600 이 맞습니다.

new Date() 부분을 조금 수정하였습니다. 2021-05-26 => 2021/05/26

[code]
<script>
$(function() {
$('#StartTime, #EndTime').on('change', function() {
var d1 = $('#StartTime').val();
var d2 = $('#EndTime').val();

if (date1 == '' || date2 == '')
return false;

var date1 = new Date(d1.replace(/-/g, '/'));
var date2 = new Date(d2.replace(/-/g, '/'));

var difference = Math.abs(date2.getTime() - date1.getTime());
var hourDifference = difference / 1000 / 3600;

$('#s_hour').html(hourDifference + '시간');
});
});
</script>
[/code]

댓글을 작성하려면 로그인이 필요합니다.

4년 전

</p>

<p><tr>

  <td> 대여 시작 시간 </td>

  <td> 대여 종료 시간 </td>

  <td> 대여 시간 </td>

</tr>

<tr>

  <td>

      <select name="StartTime" id="StartTime">

      <option value="">시작 시간을 선택하세요</option>

      <option value="1">2021-05-26 09:00:00</option>

      <option value="2">2021-05-26 10:00:00</option>

      <option value="3">2021-05-26 11:00:00</option>

      <option value="4">2021-05-26 12:00:00</option>

      <option value="5">2021-05-26 13:00:00</option>

      </select>

  </td>

  <td>

      <select name="EndTime" id="EndTime">

      <option value="">종료 시간을 선택하세요</option>

      <option value="1">2021-05-26 18:00:00</option>

      <option value="2">2021-05-26 19:00:00</option>

      <option value="3">2021-05-26 20:00:00</option>

      <option value="4">2021-05-26 21:00:00</option>

      <option value="5">2021-05-26 22:00:00</option>

      </select>

  </td>

  <td>  

  <input name="s_hour" id="s_hour" style="border:0">

  </td>

</tr>

<script>

$(function() { 

  $('#StartTime, #EndTime').on('change', function() {

        var d1 = $('#StartTime option:checked').text();

        var d2 = $('#EndTime option:checked').text();

        if (d1 == '' || d2 == '')

            return false;

        var date1 = new Date(d1);

        var date2 = new Date(d2);

        var difference = Math.abs(date2.getTime() - date1.getTime());

        var hourDifference = difference  / 1000 / 3600;

        $('#s_hour').val(hourDifference + '시간');

  });

});

</script>

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

4년 전

</p>

<p><tr>

  <td> 대여 시작 시간 </td>

  <td> 대여 종료 시간 </td>

  <td> 대여 시간 </td>

</tr>

<tr>

  <td>

      <select name="StartTime" id="StartTime">

      <option value="">시작 시간을 선택하세요</option>

      <option value="1">2021-05-26 09:00:00</option>

      <option value="2">2021-05-26 10:00:00</option>

      <option value="3">2021-05-26 11:00:00</option>

      <option value="4">2021-05-26 12:00:00</option>

      <option value="5">2021-05-26 13:00:00</option>

      </select>

  </td>

  <td>

      <select name="EndTime" id="EndTime">

      <option value="">종료 시간을 선택하세요</option>

      <option value="1">2021-05-26 18:00:00</option>

      <option value="2">2021-05-26 19:00:00</option>

      <option value="3">2021-05-26 20:00:00</option>

      <option value="4">2021-05-26 21:00:00</option>

      <option value="5">2021-05-26 22:00:00</option>

      </select>

  </td>

  <td>

  <span id="s_hour"></span>

  </td>

</tr>

<script>

$(function() { 

  $('#StartTime, #EndTime').on('change', function() {

        var d1 = $('#StartTime option:checked').text();

        var d2 = $('#EndTime option:checked').text();</p>

<p>        if (d1 == '' || d2 == '')

            return false;</p>

<p>        var date1 = new Date(d1);

        var date2 = new Date(d2);</p>

<p>        var difference = Math.abs(date2.getTime() - date1.getTime());

        var hourDifference = difference  / 1000 / 3600;</p>

<p>        $('#s_hour').html(hourDifference + '시간');

  });

});

</script></p>

<p>

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

임총
4년 전

현재 이렇게 나타나고 있습니다 ㅜㅜ

로그인 후 평가할 수 있습니다

답변에 대한 댓글 2개

마르스컴퍼니
4년 전
var date1 = new Date(d1);
var date2 = new Date(d2);
->
var date1 = new Date(d1.replace(/-/g, '/'));
var date2 = new Date(d2.replace(/-/g, '/'));
임총
4년 전
지금 캡쳐본이 수정한 코드입니다. 계속 죄송합니다 ㅠㅠ

댓글을 작성하려면 로그인이 필요합니다.

4년 전

$time1 = strtotime($t_start);

$time2 = strtotime($t_end);

$diff = $time2 - $time1 / 3600;

echo $diff . '시간';

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

임총
4년 전
[code]
<tr>
<td> 대여 시작 시간 </td>
<td> 대여 종료 시간 </td>
<td> 대여 시간 </td>
</tr>
<td>
<select name="StartTime" id="StartTime">
<option value="">시작 시간을 선택하세요</option>
<option value="1">2021-05-26 09:00:00</option>
<option value="2">2021-05-26 10:00:00</option>
<option value="3">2021-05-26 11:00:00</option>
<option value="4">2021-05-26 12:00:00</option>
<option value="5">2021-05-26 13:00:00</option>
</select>
</td>
<td>
<select name="EndTime" id="EndTime">
<option value="">종료 시간을 선택하세요</option>
<option value="1">2021-05-26 18:00:00</option>
<option value="2">2021-05-26 19:00:00</option>
<option value="3">2021-05-26 20:00:00</option>
<option value="4">2021-05-26 21:00:00</option>
<option value="5">2021-05-26 22:00:00</option>
</select>
</td>
<td>
<?php
$datetime1 = strtotime('StartTime');
$datetime2 = strtotime('EndTime');
$diff=$datetime2- $datetime1 / 3600;
echo $diff
?>
</td>
[/code]
혹시 이렇게 만들면 안되는건가요??

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인