Forgot Password ??

PHP , ASP , ASP.NET, VB.NET, C#, Java , jQuery , Android , iOS , Windows Phone

	Registered : 109,037

HOME > PHP > PHP Forum > วอนผู้รู้ช่วยทีครับ มือใหม่ทำโปรเจคเกี่ยวกับการนับเวลาถอยหลัง

วอนผู้รู้ช่วยทีครับ มือใหม่ทำโปรเจคเกี่ยวกับการนับเวลาถอยหลัง

เริ่มหัวข้อใหม่

matines

โพสกระทู้ ( 14 )
บทความ ( 0 )

ผมเป็นมือใหม่หัดเขียนนะครับ พอดี อาจารย์เพิ่มออฟชั่นในโปรเจคให้ เกี่ยวกับการนับเวลาถอยหลัง ผมอยากจะสอบถามผู้รู้หน่อยครับว่า ผมจะส่ง ค่าเวลา เริ่มกับเวลาสิ้นสุด ในวันปัจจุบันนี้ ให้ไปนับถอยหลัง ส่งค่าไปแบบไหน แล้วรับค่าแบบไหนหรอครับ

ตัวอย่างภาพ หน้าที่ จะ ส่ง
ภาพตัวอย่าง

โค้ดหน้าที่จะส่ง
Code (PHP)

<?php
include('database.php');

$strSQL = "SELECT * FROM fieldstatus  "; //WHERE date(b_date) = curdate()
$objQuery = mysqli_query($objConnect,$strSQL);

?>
<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
    <title></title>
  </head>
  <body>

    <form action="countdown.php" method="post">
        <div class="row row-cols-1 row-cols-md-2">
        <?php
        foreach($objQuery as $row)
        {
        ?>
    <div class="col sm-6">
      <div class="card text-active border-primary">
          <center>   <img src="img/<?php echo $row['field_img']; ?>" width="200px"> </center>
        <div class="card-body">
        <center><h5 class="card-title"><?php echo $row['name']; ?></h5></center>
        <?php
        $sql1 = "SELECT * FROM book WHERE b_field = '".$row['name']."'  ";
        $query1 = mysqli_query($objConnect,$sql1);
         ?>

        <center>
          <div class="col-12">
            <label for="tel">ข้อมูลผู้จอง</label>
          <center>

            <select id="userstart" class="form-control" name="userstart" >
             <option value="">กรุณาเลือก</option>
             <?php foreach($query1 as $row1) { ?>
             <option value="<?php echo $row1['b_id']; ?>"> <?php echo $row1['b_nidnumber']; ?> <?php echo $row1['b_name']; ?> <?php echo $row1['b_phone']; ?> เวลา <?php echo $row1['b_timestart']; ?> ถึง <?php echo $row1['b_timeend']; ?> </option>
               <?php } ?>
           </select>
           <input type="hidden" class="form-control" name="nidnumber" value="<?php echo $row1['b_nidnumber']; ?>"  required>
           <input type="hidden" class="form-control" name="name" value="<?php echo $row1['b_name']; ?>"  required>
           <input type="hidden" class="form-control" name="phone" value="<?php echo $row1['b_phone']; ?>"  required>
           <input type="hidden" class="form-control" name="email" value="<?php echo $row1['b_email']; ?>"  required>
           <input type="hidden" class="form-control" name="date" value="<?php echo $row1['b_date']; ?>"  required>
           <input type="hidden" class="form-control" name="b_timestart" value="<?php echo $row1['b_timestart']; ?>"  required>
           <input type="hidden" class="form-control" name="b_timeend" value="<?php echo $row1['b_timeend']; ?>"  required>
           <input type="hidden" class="form-control" name="num" value="<?php echo $row1['b_num']; ?>"  required>
    <!--  <input type="text" class="form-control" value="<?php// echo $row1['b_nidnumber']; ?> <?php //echo $row1['b_name']; ?> <?php// echo $row1['b_phone']; ?>" readonly>  -->
          </center>
          </div>
        <div class="col-3">
          <label for="timestart">เวลาเริ่ม</label>
          <input type="time" class="form-control" name="timestart"   >
          <label for="timeend">ถึง เวลา</label>
          <input type="time" class="form-control" name="timeend"   >
        </div>
      <br>
      </center>

          <center><button  type="submit" class="btn btn-outline-success" >เริ่มต้น</button></center>

        </div>
      </div>
      <br>
    </div>

      <?php
    }
    ?>
  </div>
  </form>







      </body>
      <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
      <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
      <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script>
</html>

แล้วผมก็อยากให้ตอนกดเริ่มมัน สลับการทำงานเป็นการนับเวลาถอยหลังจากหน้านี้ไปเลย
ภาพตัวอย่าง

โค้ดหน้า นับเวลาถอยหลังCode (JavaScript)


<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>

  <div id="showRemain"></div>

    <script type="text/javascript">
        function countDown(){
        var timeA = new Date(); // วันเวลาปัจจุบัน
        var timeB = new Date("10/22/2020 16:40"); // วันเวลาสิ้นสุด รูปแบบ เดือน/วัน/ปี ชั่วโมง:นาที:วินาที
        var timeDifference = timeB-timeA;
        if(timeDifference>=0){
        timeDifference=timeDifference/1000;
        timeDifference=Math.floor(timeDifference);
        var wan=Math.floor(timeDifference/86400);
        var l_wan=timeDifference%86400;
        var hour=Math.floor(l_wan/3600);
        var l_hour=l_wan%3600;
        var minute=Math.floor(l_hour/60);
        var second=l_hour%60;
        var showPart=document.getElementById('showRemain');
        showPart.innerHTML=" "+hour+" ชั่วโมง "+minute+" นาที "+second+" วินาที";
          if(wan==0 && hour==0 && minute==0 && second==0){
            clearInterval(iCountDown); // ยกเลิกการนับถอยหลังเมื่อครบ
            // เพิ่มฟังก์ชันอื่นๆ ตามต้องการ
          }
        }
        }
        // การเรียกใช้
        var iCountDown=setInterval("countDown()",1000);
        </script>

        <body Onload="countDown()">

  </html>

Tag : PHP, JavaScript, jQuery

Date : 2020-07-07 16:08:44

By : matines

View : 849

Reply : 4

No. 1

Manussawin

โพสกระทู้ ( 2,258 )
บทความ ( 5 )

หา Plugin jQuery มาช่วยครับ

https://lexxus.github.io/jq-timeTo/

Date : 2020-07-08 09:50:49

By : Manussawin

No. 2

Genesis™

โพสกระทู้ ( 4,169 )
บทความ ( 7 )

ระบบแนวนี้น่าจะใช้พวก javascript หรือพวก Framework เช่น VueJS เพราะถ้าใช้กับ Plugin moment.js จะง่ายมากเลย

ประวัติการแก้ไข
2020-07-08 10:21:14

Date : 2020-07-08 10:20:57

By : Genesis™

No. 3

matines

โพสกระทู้ ( 14 )
บทความ ( 0 )

ขอบคุณสำหรับคำแนะนำของพี่ๆทั้งสองท่านมากครับ เดี๋ยวผมจะลองไปศึกษาดูครับผม

Date : 2020-07-09 21:50:04

By : matines

No. 4

matines

โพสกระทู้ ( 14 )
บทความ ( 0 )

ตอบความคิดเห็นที่ : 2 เขียนโดย : Genesis™ เมื่อวันที่ 2020-07-08 10:20:57

รายละเอียดของการตอบ ::

เดี๋ยวลองศึกษาเพิ่มเติมดูนะครับ

Date : 2020-07-09 21:51:38

By : matines

ค้นหาข้อมูล

แสดงความคิดเห็น

Re : วอนผู้รู้ช่วยทีครับ มือใหม่ทำโปรเจคเกี่ยวกับการนับเวลาถอยหลัง

รายละเอียด

เพื่อความเรียบร้อยของข้อความ ควรจัดรูปแบบให้พอดีกับขนาดของหน้าจอ เพื่อง่ายต่อการอ่านและสบายตา และตรวจสอบภาษาไทยให้ถูกต้อง

อัพโหลดแทรกรูปภาพ

Notice

เพื่อความปลอดภัยของเว็บบอร์ด ไม่อนุญาติให้แทรก แท็ก [img]....[/img] โดยการอัพโหลดไฟล์รูปจากที่อื่น เช่นเว็บไซต์ ฟรีอัพโหลดต่าง ๆ
อัพโหลดแทรกรูปภาพ ให้ใช้บริการอัพโหลดไฟล์ของไทยครีเอท และตัดรูปภาพให้พอดีกับสกรีน เพื่อความโหลดเร็วและไฟล์ไม่ถูกลบทิ้ง

เพื่อความปลอดภัยและการตรวจสอบ กระทู้ที่แทรกไฟล์อัพโหลดไฟล์จากที่อื่น อาจจะถูกลบทิ้ง

โดย

อีเมล์

บวกค่าให้ถูก