Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> HTML

คุณสมบัติ HTML DOM Input Week step

คุณสมบัติ step ของ HTML DOM Input Week กำหนดช่วงสัปดาห์ที่ถูกต้อง (legal intervals) สำหรับช่องป้อนสัปดาห์

ไวยากรณ์ (Syntax)

การดึงค่า step

inputWeekObject.step

การกำหนดค่า step

inputWeekObject.step = number

พารามิเตอร์ (Parameters)

weeksค่าที่ถูกต้องคือจำนวนเต็มบวกทั้งหมด (positive integers)

ตัวอย่างการใช้งาน

ตัวอย่างตั้งค่า step สำหรับช่องสัปดาห์

<!DOCTYPE html>
<html>
<head>
<title>Input Week step</title>
<style>
  form {
    width: 70%;
    margin: 0 auto;
    text-align: center;
  }
  * {
    padding: 2px;
    margin: 5px;
  }
  input[type="button"] {
    border-radius: 10px;
  }
</style>
</head>
<body>
<form>
  <fieldset>
    <legend>Week-step</legend>
    <label for="WeekSelect">สัปดาห์และปี : <input type="week" id="WeekSelect"> </label> 
    <input type="button" onclick="changeStep('2')" value="Step Weeks by 2"> 
    <input type="button" onclick="changeStep('3')" value="Step Weeks by 3"> 
    <div id="divDisplay"></div> 
  </fieldset> 
</form> 
<script> 
  var divDisplay = document.getElementById("divDisplay"); 
  var inputWeek = document.getElementById("WeekSelect"); 
  function changeStep(myStep) { 
    inputWeek.step = myStep; 
    divDisplay.textContent = 'Weeks step: ' + inputWeek.step; 
  } 
</script> 
</body>
</html>

ผลลัพธ์

คลิก "Step Weeks by 3" - step = 3 (UI ปฏิทินจะกระโดดทีละ 3 สัปดาห์)

เปิดปฏิทินหลังตั้งค่า step 3 - เลือกได้เฉพาะสัปดาห์ที่ห่างกัน 3 สัปดาห์

ความแตกต่างจาก Time step: Week step รับค่าจำนวนเต็มบวกใดๆ ได้ (ไม่ต้องหาร 60 ลงตัว)