자바스크립트 타이머 구현
- 一个新手원래의
- 2017-10-16 09:56:311427검색
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>自动增长计时器</title>
<script type="text/javascript">
var atime;
function clock(){
var time=new Date();
atime=time.getHours()+":"+time.getMinutes()+":"+time.getSeconds();
document.getElementById("clock").value = atime;
}
setInterval(clock,1000);
</script>
</head>
<body>
<form>
<input type="text" id="clock" size="50" style="background:#000;color:#00ff00;width:55px"; />
</form>
</body>
</html>
효과:
현재 시간 표시, 자동 증가
버튼에 타이머 추가(시작 및 일시 중지)
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>计时器</title>
<script type="text/javascript">
var num=0;
var i;
function startCount(){
document.getElementById('count').value=num;
num=num+1;
i=setTimeout("startCount()",1000);
}
function stopCount(){
clearTimeout(i);
}
</script>
</head>
<body>
<form>
<input type="text" id="count" />
<input type="button" value="Start" onclick="startCount()"/>
<input type="button" value="Stop" onclick="stopCount()" />
</form>
</body>
</html>효과:
시작 버튼 클릭, 0부터 계산, 1초 추가 . 버튼을 클릭하면 현재 상태를 중지하고 유지합니다.
요약:
1.setInterval(코드, 상호 작용 시간);
매개 변수: 코드: 함수 이름 또는 코드 문자열일 수 있습니다. 상호 작용 시간: 상호 작용 시간을 설정합니다.
clearInterval(id_from_setInterval); : setInterval()은 ID 값을 반환합니다.
2.setTimeout(코드, 지연 시간)
매개변수: code: 함수 이름 또는 코드 문자열일 수 있습니다. 지연 시간: 지연 시간을 설정합니다.
clearTimeout(id_from_setTimeout)
매개변수: ID setTimeout() 값입니다.
위 내용은 자바스크립트 타이머 구현의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.