如何实现从选中的12小时制时间中减去指定分钟数？

Let's get this time calculation working properly! The core idea is to convert your selected 12-hour time into a total number of minutes since midnight, do the subtraction, then convert back to the familiar 12-hour AM/PM format. Here's how to modify your code:

Updated HTML (no changes needed to the structure): #

<select id="selectHour">
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
  <option value="6">6</option>
  <option value="7">7</option>
  <option value="8">8</option>
  <option value="9">9</option>
  <option value="10">10</option>
  <option value="11">11</option>
  <option value="12">12</option>
</select>
<select id="selectMinute">
  <option value="00">00</option>
  <option value="5">5</option>
  <option value="10">10</option>
  <option value="15">15</option>
  <option value="20">20</option>
  <option value="25">25</option>
  <option value="30">30</option>
  <option value="35">35</option>
  <option value="40">40</option>
  <option value="45">45</option>
  <option value="50">50</option>
  <option value="55">55</option>
</select>
<select id="selectAMPM">
  <option value="am">am</option>
  <option value="pm">pm</option>
</select>
<button onclick="myFunction()">Get Result</button>
<p id="result"></p>

Modified JavaScript Function: #

function myFunction() {
  // Grab selected values and convert to numbers where needed
  const hour = parseInt(document.getElementById("selectHour").value);
  const minute = parseInt(document.getElementById("selectMinute").value);
  const ampm = document.getElementById("selectAMPM").value;
  
  // Step 1: Convert 12-hour time to total minutes since midnight
  let totalMinutes;
  if (ampm === "am") {
    // 12am translates to 0 hours in 24-hour format
    totalMinutes = (hour === 12 ? 0 : hour) * 60 + minute;
  } else {
    // 12pm stays 12, others add 12 to get 24-hour value
    totalMinutes = (hour === 12 ? 12 : hour + 12) * 60 + minute;
  }
  
  // Step 2: Subtract your target minutes (adjust this value if needed later)
  const minutesToSubtract = 70;
  totalMinutes -= minutesToSubtract;
  
  // Step 3: Handle cases where we go back past midnight
  if (totalMinutes < 0) {
    totalMinutes += 24 * 60; // Add a full day's worth of minutes to wrap around
  }
  
  // Step 4: Convert back to 12-hour AM/PM format
  const newHour = Math.floor(totalMinutes / 60);
  const newMinute = totalMinutes % 60;
  const newAmPm = newHour >= 12 ? "pm" : "am";
  
  // Format hour to show 12 instead of 0, and 1-11 instead of 13-23
  const displayHour = newHour === 0 ? 12 : newHour > 12 ? newHour - 12 : newHour;
  // Ensure minutes have a leading zero (e.g., 5 becomes "05")
  const displayMinute = newMinute.toString().padStart(2, "0");
  
  // Show the final result
  document.getElementById("result").innerHTML = `${displayHour}:${displayMinute} ${newAmPm}`;
}

Key Breakdown: #

• 12-hour to total minutes: We map 12am to 0 hours and 12pm to 12 hours to make arithmetic simple. This turns any time into a single number we can subtract from.
• Cross-midnight handling: If subtracting minutes makes the total negative (like your 12:20am example), we add 1440 minutes (24*60) to jump back to the previous day.
• Formatting back: We convert the total minutes back to hours/minutes, then adjust the hour to fit the 12-hour system and add leading zeros to minutes for consistency.

Testing your example: 12:20am becomes 20 total minutes. Subtract 70 gives -50, add 1440 to get 1390 minutes. That's 23 hours and 10 minutes, which converts to 11:10pm—exactly what you wanted!

内容的提问来源于stack exchange，提问作者Jerrry