为什么我打开网站时闹钟响了？答案

【问题标题】：Why is my alarm going off when I open the site?为什么我打开网站时闹钟响了？
【发布时间】：2020-07-15 19:03:11
【问题描述】：

谁能告诉我为什么我打开网站时闹钟响了？

这是我所有的代码：

var noon = 12;
var evening = 18;

// Getting it to show the current time on the page
var showCurrentTime = function()
{
    // display the string on the webpage
    var clock = document.getElementById('clock');

    var currentTime = new Date();

    var hours = currentTime.getHours();
    var minutes = currentTime.getMinutes();
    var seconds = currentTime.getSeconds();
    var meridian = "AM";

    // Set hours
      if (hours >= noon)
      {
          meridian = "PM";
      }

      if (hours > noon)
      {
          hours = hours - 12;
      }

    // Set Minutes
    if (minutes < 10)
    {
        minutes = "0" + minutes;
    }

    // Set Seconds
    if (seconds < 10)
    {
        seconds = "0" + seconds;
    }

    // put together the string that displays the time
    // date
    var d = new Date();
    var mon = new Array(11);
      mon[0] = "January";
      mon[1] = "February";
      mon[2] = "March";
      mon[3] = "April";
      mon[4] = "May";
      mon[5] = "June";
      mon[6] = "July";
      mon[7] = "August";
      mon[8] = "September";
      mon[9] = "October";
      mon[10] = "November";
      mon[11] = "December";
    var weekday = new Array(7);
     weekday[0] = "Sunday";
     weekday[1] = "Monday";
     weekday[2] = "Tuesday";
     weekday[3] = "Wednesday";
     weekday[4] = "Thursday";
     weekday[5] = "Friday";
     weekday[6] = "Saturday";
    var day = weekday[d.getDay()];
    var year = d.getFullYear(); 
    var month = mon[d.getMonth()]; 
    var dayOfMonth = d.getDate();  

    // actual time
    var clockTime = day + ', ' + month + ' ' + dayOfMonth + ', ' + year + ' / ' + hours + ' : ' + minutes + ' : ' + seconds + " " + meridian;
    clock.innerText = clockTime;
};

// Getting the clock to increment on its own

var updateClock = function() {
  var time = new Date().getHours();
  var timeEventJS = document.getElementById("timeEvent");
  showCurrentTime();
};
updateClock();

// Getting the clock to increment once a second

var oneSecond = 1000;
setInterval(updateClock, oneSecond);

var soundAlarm = function (){
  var nowTime = new Date();
  var hours = nowTime.getHours();
  var minutes = nowTime.getMinutes();
  var seconds = nowTime.getSeconds();  
   var selectedAlarmHours = $('#hourSelector').val();
   var selectedAlarmMinutes = $('#minuteSelector').val();
   var selectedAlarmHoursMili = selectedAlarmHours * 360000;
   var selectedAlarmMinutesMili = selectedAlarmMinutes * 60000; 
   var selectedTimeNowAll = selectedAlarmHoursMili + selectedAlarmMinutesMili;
  if (nowTime >= selectedTimeNowAll) {
   document.getElementById('ringtone').play();  
  }  
};

和 HTML

<html>
<head>
  <link href="https://fonts.googleapis.com/css?family=Bungee|Bungee+Shade|Covered+By+Your+Grace" rel="stylesheet">
  <link href="https://fonts.googleapis.com/css?family=Open+Sans:800" rel="stylesheet">

  <link rel="stylesheet" type="text/css" href="alarmtest.css">

</head>
<body>

  <audio id="ringtone" src="SamsungS6Mp3Ringtones.mp3" preload="auto" autoplay="false"></audio>  

  <div class="page">
    <header>
      <h1> Clock / Alarm </h1>
    </header>
    <span id="clock"></span>

    <br><br><br><br><br><br><br><br><br>

    <span id="setAlarmTime"><u>Set Alarm Time</u></span>
    <br>
    <select id="hourSelector">
      <option> Set Hours </option>
      <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="minuteSelector">
      <option> Set Minutes </option>
      <option value = "0"> 00 </option>
      <option value = "1"> 01 </option>
      <option value = "2"> 02 </option>
      <option value = "3"> 03 </option>
      <option value = "4"> 04 </option>
      <option value = "5"> 05 </option>
      <option value = "6"> 06 </option>
      <option value = "7"> 07 </option>
      <option value = "8"> 08 </option>
      <option value = "9"> 09 </option>
      <option value = "10"> 10 </option>
      <option value = "11"> 11 </option>
      <option value = "12"> 12 </option>
      <option value = "13"> 13 </option>
      <option value = "14"> 14 </option>
      <option value = "15"> 15 </option>
      <option value = "16"> 16 </option>
      <option value = "17"> 17 </option>
      <option value = "18"> 18 </option>
      <option value = "19"> 19 </option>
      <option value = "20"> 20 </option>
      <option value = "21"> 21 </option>
      <option value = "22"> 22 </option>
      <option value = "23"> 23 </option>
      <option value = "24"> 24 </option>
      <option value = "25"> 25 </option>
      <option value = "26"> 26 </option>
      <option value = "27"> 27 </option>
      <option value = "28"> 28 </option>
      <option value = "29"> 29 </option>
      <option value = "30"> 30 </option>
      <option value = "31"> 31 </option>
      <option value = "32"> 32 </option>
      <option value = "33"> 33 </option>
      <option value = "34"> 34 </option>
      <option value = "35"> 35 </option>
      <option value = "36"> 36 </option>
      <option value = "37"> 37 </option>
      <option value = "38"> 38 </option>
      <option value = "39"> 39 </option>
      <option value = "40"> 40 </option>
      <option value = "41"> 41 </option>
      <option value = "42"> 42 </option>
      <option value = "43"> 43 </option>
      <option value = "44"> 44 </option>
      <option value = "45"> 45 </option>
      <option value = "46"> 46 </option>
      <option value = "47"> 47 </option>
      <option value = "48"> 48 </option>
      <option value = "49"> 49 </option>
      <option value = "50"> 50 </option>
      <option value = "51"> 51 </option>
      <option value = "52"> 52 </option>
      <option value = "53"> 53 </option>
      <option value = "54"> 54 </option>
      <option value = "55"> 55 </option>
      <option value = "56"> 56 </option>
      <option value = "57"> 57 </option>
      <option value = "58"> 58 </option>
      <option value = "59"> 59 </option>
    </select>  



  </div>
  <script src="ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script type = "text/javascript" src = "jstest.js"></script>
</body>
</html>

【问题讨论】：

你的 sn-p 从不调用 soundAlarm，让我相信这不是你的全部代码？
不，这是我所有的代码。
@MARSHMALLOW 这根本没有帮助，对 OP 大喊大叫也无济于事
编辑您的帖子并按照如何提问。当您提出问题时，请务必尝试详细说明您的问题。这将增加获得好答案的机会。
@PythonHelp 我知道删除这些句子没有帮助 xD。但我还是不明白你的问题。访问stackoverflow.com/help/how-to-ask 并仔细阅读此页面。另请访问游览页面（您将获得徽章！）stackoverflow.com/tour。这将帮助您在将来修改一个好的问题。

标签： javascript jquery html css

【解决方案1】：

<audio> 的 autoplay 属性是一个标志，它没有值，所以：

 <audio autoplay='false'>

与

相同

 <audio autoplay>

所以和

一样

 <audio autoplay='true'>

因此您的音频会在页面加载后立即自动播放。

<audio> 带有没有自动播放属性的示例 sn-p 的详细信息：

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/audio

与autoplay=false 相同的示例在加载时播放音频

https://jsfiddle.net/x49mh5e3/

【讨论】：

我刚刚把 autoplay='false' 改成了 autostart='false'

【解决方案2】：

你能告诉更多关于你的问题，因为我已经完成了所有工作

var noon = 12; var evening = 18;
var showCurrentTime = function()
{
  
    // display the string on the webpage
    var clock = document.getElementById('clock');

    var currentTime = new Date();

    var hours = currentTime.getHours();
    var minutes = currentTime.getMinutes();
    var seconds = currentTime.getSeconds();
    var meridian = "AM";

    // Set hours
      if (hours >= noon)
      {
          meridian = "PM";
      }

      if (hours > noon)
      {
          hours = hours - 12;
      }

    // Set Minutes
    if (minutes < 10)
    {
        minutes = "0" + minutes;
    }

    // Set Seconds
    if (seconds < 10)
    {
        seconds = "0" + seconds;
    }

    // put together the string that displays the time
    // date
    var d = new Date();
    var mon = new Array(11);
      mon[0] = "January";
      mon[1] = "February";
      mon[2] = "March";
      mon[3] = "April";
      mon[4] = "May";
      mon[5] = "June";
      mon[6] = "July";
      mon[7] = "August";
      mon[8] = "September";
      mon[9] = "October";
      mon[10] = "November";
      mon[11] = "December";
    var weekday = new Array(7);
     weekday[0] = "Sunday";
     weekday[1] = "Monday";
     weekday[2] = "Tuesday";
     weekday[3] = "Wednesday";
     weekday[4] = "Thursday";
     weekday[5] = "Friday";
     weekday[6] = "Saturday";
    var day = weekday[d.getDay()];
    var year = d.getFullYear(); 
    var month = mon[d.getMonth()]; 
    var dayOfMonth = d.getDate();  

    // actual time
    var clockTime = day + ', ' + month + ' ' + dayOfMonth + ', ' + year + ' / ' + hours + ' : ' + minutes + ' : ' + seconds + " " + meridian;
    clock.innerText = clockTime;
};

// Getting the clock to increment on its own

var updateClock = function() {
  var time = new Date().getHours();
  var timeEventJS = document.getElementById("timeEvent");
  showCurrentTime();
};
updateClock();

// Getting the clock to increment once a second

var oneSecond = 1000;
setInterval(updateClock, oneSecond);

var soundAlarm = function (){
  var nowTime = new Date();
  var hours = nowTime.getHours();
  var minutes = nowTime.getMinutes();
  var seconds = nowTime.getSeconds();  
   var selectedAlarmHours = $('#hourSelector').val();
   var selectedAlarmMinutes = $('#minuteSelector').val();
   var selectedAlarmHoursMili = selectedAlarmHours * 360000;
   var selectedAlarmMinutesMili = selectedAlarmMinutes * 60000; 
   var selectedTimeNowAll = selectedAlarmHoursMili + selectedAlarmMinutesMili;
  if (nowTime >= selectedTimeNowAll) {
   document.getElementById('ringtone').play();  
  }  
};

&lt;div id="clock"&gt;&lt;/div&gt;

【讨论】：

我的闹钟在我打开网站时响起，而不是在应该响起的时候。
将您的问题添加到您的 html
“您的代码有效”不是答案。如果它对 OP 不起作用，那么一定有一些您的答案没有解决的潜在问题。
这个“答案”中的代码是“有效的”，因为它只是删除了有问题的行。