이 기사에서는 JavaScript에서 두 개의 연속 버튼 클릭 사이에서 시간 간격을 설정하는 방법에 대해 설명하며 참조를 위해 귀하와 공유됩니다. 특정 구현 방법은 다음과 같습니다.
실제 응용 프로그램에서 여러 번 버튼을 중단없이 클릭하지 않으려면 버튼을 다시 클릭하려면 특정 시간 간격을 제한해야합니다. 코드 예제를 통해이 기능을 구현하는 방법을 소개하겠습니다. 코드는 다음과 같습니다.
다음과 같이 코드를 복사하십시오. <! doctype html>
<html>
<헤드>
<meta charset = "utf-8">
<meta name = "author"content = "// www.vevb.com/"/>
<title> wulin.com </title>
<script type = "text/javaScript">
Window.onload = function () {
var odiv = document.getElementById ( "thediv");
var obt = document.getElementById ( "bt");
var count = 0;
var flag = null;
함수 완료 () {
if (count == 0) {
ClearInterval (플래그);
}
또 다른{
count = count-1;
}
}
obt.onclick = function () {
var val = parseint (odiv.innerhtml);
if (count == 0) {
odiv.innerhtml = val+1;
카운트 = 20;
flag = setInterVal (완료, 1000);
}
또 다른{
Alert ( "또한"+(count)+"seconds click");
}
}
}
</스크립트>
</head>
<body>
<div id = "thediv"> 0 </div>
<입력 유형 = "버튼"id = "bt"value = "보기 효과"/>
</body>
</html>
위의 코드는 요구 사항을 구현하고 버튼을 클릭하는 간격 시간을 제한 할 수 있습니다. 이 효과는 게시 간격 시간 제한 등과 같은 다른 기능으로 확장 될 수 있습니다. 아래 구현 프로세스를 소개하겠습니다.
코드 주석은 다음과 같습니다.
1.window.onload = function () {}는 문서 내용이 완전히로드 된 후에 함수의 코드가 실행되도록 지정합니다.
2.var odiv = document.getElementById ( "thediv"), div 요소 객체를 얻습니다.
3.var obt = document.getElementById ( "bt"), 버튼 객체를 가져옵니다.
4.var count = 0, 변수를 선언하고 초기 값을 0에 할당하며,이 값은 간격 시간을 저장하는 데 사용됩니다.
5.var flag = null, 변수를 선언하고 초기 값을 null에 할당하면이 변수는 타이머 함수의 반환 값을 저장하는 데 사용됩니다.
6. function done () {},이 함수는 타이머 함수에 의해 지속적으로 호출하여 카운트를 줄일 수 있습니다.
7.if (count == 0) {clearinterval (flag);}, count == 0이면 타이머 함수의 실행이 중지됩니다.
8.else {count = count-1;}, 0이 아닌 경우 감소 작업을 수행하십시오.
9.Obt.onClick = function () {}, 버튼의 클릭 이벤트 처리 기능을 등록하십시오.
10.var val = parseint (odiv.innerhtml), div에서 내용을 가져 와서 정수로 변환하십시오.
11.IF (count == 0) {
odiv.innerhtml = val+1;
카운트 = 20;
flag = setInterVal (완료, 1000);
}
Count가 0이면 DIV에서 +1을, Count를 20으로 설정하고 타이머 기능의 실행이 켜집니다.
12.ELSE {alert ( "또한"+(count)+"seconds to click");}, count가 0과 같지 않으면 팝업 할 때 클릭하는 데 얼마나 걸립니까?
이 기사가 모든 사람의 JavaScript 프로그래밍에 도움이되기를 바랍니다.