Question

我刚开始学习javascript，如何修复if / else语句中数字的重叠。我想使用早上6点到早上9点来提醒某个消息，我希望使用下午5点到晚上8点来提醒不同的消息。

<html>
<head>
<script>

</script>
<title> Javascript program</title>
</head>
<body>
<script>
var hour=eval (prompt("What is the current hour?", ""));
if (hour > 6 && hour <=  9){
alert("Breakfast time ");
}
else if (hour => 11 && hour <= 1) {
alert("Time for lunch");
}
else if (hour => 5 && hour <= 8){
alert("Dinner is served");
}
else{
alert("Sorry, you'll have to wait, or go get a snack");
}
</script>
</body>
</html>

Answer 1

描述

从12小时AM / PM时钟切换到24小时制，默认情况下getHours返回。

否则，在提示用户时，您还需要将AM / PM作为下拉列表。

JavaScript 24小时解决方案

// Removed prompt in favor of just pulling the hour
//var hour=eval (prompt("What is the current hour?", ""));
var hour = new Date().getHours();

// Changed to 24 hour schedule
if (hour > 6 && hour <=  9){
  console.log("Breakfast time ");
} else if (hour >= 11 && hour <= 13) {
  console.log("Time for lunch");
} else if (hour >= 17 && hour <= 20){
  console.log("Dinner is served");
} else{
  console.log("Sorry, you'll have to wait, or go get a snack");
}

JavaScript 12小时AM / PM解决方案

<强> jsFiddle

<强> HTML

<a data-target="#myModal" role="button" class="btn" data-toggle="modal">Launch demo modal</a>

<div class="modal fade hide" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
    <h3 id="myModalLabel">Modal header</h3>
  </div>
  <div class="modal-body">
    <input type='text' id='hour'/>
      <select id='AMPM'>
          <option value=0>AM</option>
          <option value=12>PM</option>
      </select>
  </div>
  <div class="modal-footer">
    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
    <button class="btn btn-primary" data-dismiss="modal" id='save'>Save changes</button>
  </div>
</div>

<强>的JavaScript

var getMeal = function() {
    var hour = parseInt($('#hour').val());
    var AMPM = parseInt($('#AMPM').val());
    if(hour === 12 && AMPM ===0) {
      hour = 0;
    } else {
      hour += AMPM;
    }

    // Changed to 24 hour schedule
    if (hour > 6 && hour <=  9){
      console.log("Breakfast time ");
    } else if (hour >= 11 && hour <= 13) {
      console.log("Time for lunch");
    } else if (hour >= 17 && hour <= 20){
      console.log("Dinner is served");
    } else{
      console.log("Sorry, you'll have to wait, or go get a snack");
    }
};

$(document).ready(function() {
  $('#save').on('click', getMeal);
});

Answer 2

因为您正在从用户那里获得意见，所以您真的不知道您将会获得什么样的价值。

在您的代码中，您假设用户将使用12小时制。使用12小时制时钟的问题是给定一个数字，例如7，它可能对应7 am或7 pm。作为一名程序员，你不知道用户的意思，而且除此之外，你在使用整数时也无法区分你自己的代码。

更好的策略是使用24小时制。给定1到24之间的任何数字，您就知道当天的确切时间。

但是，您仍然不知道用户将如何将值输入提示中的问题......他们会使用12小时的时间吗？给上午/下午？或用户24小时？我们可以做的是解析输入并仅接受来自用户的某些类型的输入。我编写了一个示例解析器函数，其中包含代码注释，解释了最新情况。

function parse_input(input) {
  // these are the variable we will use in the function
  var time, matches, am_or_pm;

  // make sure the input variable has been initialised to a string
  input = input || '';

  // check if the input contains a time and am/pm
  matches = input.match(/^([1-9]|10|11|12)\s*(am|pm)/i);

  // try to get the time from the matches
  if (matches) {
    time = parseInt(matches[1]); // Note: may evaluate to NaN
    am_or_pm = matches[2];
  }

  // if there was no match use the original input.
  time = time || parseInt(input); // Note: may evaluate to NaN

  // adjust to 24 hr time if user entered 'pm'
  // Note: we don't need to do anything if the user enters 'am'
  if (am_or_pm && am_or_pm.toLowerCase() == 'pm') {
    time = time + 12;
  }

  return time;
}

然后我们可以重新编写您的原始代码以使用新的解析器函数和24小时时间：

// get the time from the user as you did before
var input = prompt("What is the current hour?", "");

// use the custom parser function to get the hour of day in 24 hr time
var hour = parse_input(input);

// respond to the user based on the given time 
if (hour > 6 && hour <=  9) {
  alert("Breakfast time ");
}
else if (hour >= 11 && hour <= 13) {
  alert("Time for lunch");
}
else if (hour >= 17 && hour <= 20) {
  alert("Dinner is served");
}
else if (isNaN(hour) || hour > 23 || hour < 1) {
  // Let the user know that their input was not valid
  alert("Sorry, you didn't enter a valid time");
}
else {
  alert("Sorry, you'll have to wait, or go get a snack");
}

最后一件事，我注意到你有大于或等于的符号为=>。这实际上在最近的Javascript版本中创建了一个函数，而if语句正在评估true。要使用的正确符号是>=。

我如何修复if / else语句中的重叠数字？

2 个答案:

描述

JavaScript 24小时解决方案

JavaScript 12小时AM / PM解决方案