我有一个 Javascript 倒计时器,单击按钮即可调用它。 Javascript 在外部文件中定义。定时器的CSS也是一个外部文件。
当我在页面开头包含 javascript 时,我得到了
clock.queryselector is not a function
当我在页面末尾包含 javascript 时,我得到了
initializeClock is not defined
我应该把这个文件保存在哪里。请帮助我缺少什么?
HTML
<head runat="server">
<title></title>
<link href="StyleSheet.css" rel="stylesheet" type="text/css" />
<%-- <script src="JScript.js" type="text/javascript"></script>--%>
</head>
<body>
<form id="form1" runat="server">
<div>
<h3>Revervation Time Left</h3>
<div id="clockdiv" runat="server" style=" border: 1px solid red;">
<div>
<span class="minutes"></span>
<div class="smalltext">Minutes</div>
</div>
<div>
<span class="seconds"></span>
<div class="smalltext">Seconds</div>
</div>
</div>
<div >
<asp:Button ID="Button1" runat="server" Text="Button" />
</div>
</div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
</form>
<script src="JScript.js" type="text/javascript"></script>
</body>
</html>
代码
Protected Sub Button1_Click(sender As Object, e As System.EventArgs) Handles Button1.Click
ScriptManager.RegisterStartupScript(Me, Me.GetType(), "myFunction", "initializeClock('clockdiv', 'Aug 10 2016 13:02:23');", True)
'ScriptManager.RegisterClientScriptBlock(Me, Me.GetType(), "none", "CallMe();", True)
End Sub
Javascript
function getTimeRemaining(endtime) {
var t = Date.parse(endtime) - Date.parse(new Date());
var seconds = Math.floor((t / 1000) % 60);
var minutes = Math.floor((t / 1000 / 60) % 60);
return {
'minutes': minutes,
'seconds': seconds
};
}
function initializeClock(id, endtime) {
// alert(endtime);
var clock = document.getElementById(id);
var minutesSpan = clock.querySelector('.minutes');
var secondsSpan = clock.querySelector('.seconds');
function updateClock() {
var t = getTimeRemaining(endtime);
minutesSpan.innerHTML = ('0' + t.minutes).slice(-2);
secondsSpan.innerHTML = ('0' + t.seconds).slice(-2);
if (t.total <= 0) {
clearInterval(timeinterval);
}
}
updateClock();
var timeinterval = setInterval(updateClock, 1000);
}
文件夹结构:
最佳答案
请检查为什么您会收到这个错误:clock.queryselector is not a function。
你的 JS 文件中缺少某些内容,如果你能解决它。它会帮助你。
当您在底部包含 JS 文件时,您会收到错误,因为函数被调用但不存在。因此最好选择将其仅放在顶部。
关于javascript - JavaScript 中函数未定义冲突,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38868539/