Question

我希望有人可以就如何解决我遇到的问题向我提供一些见解。我已经搜索了论坛和谷歌，并且实际上发现有人在9月份发布了同样的问题（来自同一教科书的不同活动），但他没有人给他们一个解决方案。我对我的代码所遇到的问题是，根据教科书，按照书中的说明输入后，它应该是动态显示的格式：＆＃34;今天是2015年5月6日星期三只有50天，直到弗兰克的修复纪念日销售。＆＃34;然而，它出现了：＆＃34;今天是2015年5月6日2015.距离弗兰克的修复纪念日销售只有50天。＆＃34;

如您所见，年份重复两次，日期不是完整格式。

我的代码是：

＆＃13;

function scrollColor() {
  styleObject = document.getElementsByTagName('html')[0].style
  styleObject.scrollbarFaceColor = "#191a1f"
  styleObject.scrollbarTrackColor = "#e4e5e8"
}

function countDown() {
  var today = new Date()
  var dayofweek = today.toLocaleString()
  dayLocate = dayofweek.indexOf(" ")
  weekDay = dayofweek.substring(0, dayLocate)
  newDay = dayofweek.substring(dayLocate)
  dateLocate = newDay.indexOf(",")
  monthDate = newDay.substring(0, dateLocate + 1)
  yearLocate = dayofweek.indexOf("2015")
  year = dayofweek.substr(yearLocate, 4)


  var memDay = new Date("May 26, 2015")
  var daysToGo = memDay.getTime() - today.getTime()
  var daysTomemDay = Math.ceil(daysToGo / (1000 * 60 * 24 * 24))

  displayCountDown.innerHTML = "<h3>Today is " + weekDay + " " + monthDate + " " + year + ". Only " + daysTomemDay + " days until Frank's Fix-it Memorial Day Sale.</h3>"
}

function copyRight() {
  var lastModDate = document.lastModified
  var lastModDate = lastModDate.substring(0, 10)
  displayCopyRight.innerHTML = "<p style='font-size:8pt;'>The URL of this document is " + document.URL + "<br />Copyright Frank's Fix-t Hardware. This document was last modified " + lastModDate + ".</p>"
}

＆＃13;

.center {
  text-align: center;
}
td {
  padding: 5px;
}
.cell-width {
  width: 50%;
}
table.width {
  width: 75%;
  margin-left: auto;
  margin-right: auto;
}
.left-align {
  width: 50%;
  left: 0;
}
.right-align {
  width: 50%;
  right: 0;
  text-align: right;
}
.header1 {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14pt;
  font-weight: bold;
  color: #5f6065;
}
.r_saletext {
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 12pt;
  font-style: italic;
  font-weight: bold;
  color: #666;
  text-align: right;
}
.l_saletext {
  font-family: Georgia, "Times New Roman", Times, serif;
  font-size: 12pt;
  font-style: italic;
  font-weight: bold;
  color: #666;
  text-align: left;
}
#alignright {
  text-align: right;
}

＆＃13;

<body onload="scrollColor(); countDown(); copyRight()">

  <div class="center">
    <p>
      <img src="make9-1banner.jpg" width="700" height="120" alt="Frank's Fix-it banner">
    </p>
    <p style="font-family:Arial, Helvetica, sans-serif; font-size:14pt; font-weight:bold;">Frank's Fix-it Hardware</p>
    <img src="img-metaldivider.jpg" width="700" height="5" alt="divider">

    <div id="displayCountDown" class="center">
    </div>

    <img src="img-metaldivider.jpg" width="700" height="5" alt="divider">
  </div>
  <table class="width">
    <tr>
      <td colspan="2">
        <p class="header1" style="font-weight:bold; font-family: Arial, Helvetica, sans-serif; font-size:12pt">Frank's Fix-it Hardware</p>
        <p>Frank's Fix-it Hardware has been a member of the greater Anaheim and Fullerton community for over fifty years, with four stores. Our Anaheim store, near Disneyland, is open from 6 a.m. to midnight. Monday through Saturday, and 9 a.m. to 9 p.m.
          on Sunday for those emergency repairs that materialize when you least expect them. Our other locations are open seven days a week from 8 a.m. to 9 p.m.</p>
      </td>
    </tr>
    <tr>
      <td colspan="2">
        <p class="header1" style="font-weight:bold; font-family: Arial, Helvetica, sans-serif; font-size:12pt">Fix-it Membership Club</p>
        <p>Become a member of our Fix-it Membership Club. Every $250 in purchases earns you $10 in Fix-it bucks, which can be applied to any item, including closeout and sale items. Sorry, the only exception is special orders, due to manufacturers limitations.</p>
      </td>
    </tr>
    <tr>
      <td colspan="2" class="center"><span style="font-family:Arial, Helvetica, sans-serif; font-size:14pt; font-weight:bold;">This week's specials</span>
      </td>
    </tr>
    <tr>
      <td class="r_saletext">Screw Driver Set 25% Off</td>
      <td class="l_saletext">Free Drill Bit Sharpening</td>
    </tr>
    <tr>
      <td id="alignright">
        <img src="make9-1toolset1.jpg" alt="screw driver set" width="270" height="258">
      </td>
      <td>
        <img src="make9-1drillbits.jpg" width="272" height="256" alt="drill bits">
      </td>
    </tr>
  </table>
  <div id="displayCopyRight">
  </div>
</body>

＆＃13;

Answer 1

如果您尝试打印出dayofweek变量，它会向您显示它与6/5/2015 15.26.53类似，而不是您期望的文字表示。

要解决此问题，您应该查看javascript中的格式化日期。在Stack Overflow上应该有很多关于这个的问题，甚至更多关于Google的问题！

Answer 2

toLocaleString()函数有两个可选参数，一个是语言环境和一个格式。既然你没有提供任何一个，你会得到像2015年5月6日那样的输出。如果为语言环境设置选项，尤其是格式化选项，则可以控制结果的外观。请查阅MDN page for toLocaleString()以获得有关该功能的完整说明，但希望花几分钟时间阅读。

我很想发布您正在寻找的确切解决方案，但由于这是一项家庭作业，我宁愿您阅读并了解它如何为您自己工作。如果你取得进步但却陷入困境，请回过头来澄清你的问题。如果你真的关闭，有人可能会给你你需要完成的轻推。

Javascript类简介，日期未正确格式化，如教科书中所示

2 个答案: