집 > 기사 > 웹 프론트엔드 > JS 스크립트로 웹페이지 자동 플래시 세일 예시 공유 실현

JS 스크립트로 웹페이지 자동 플래시 세일 예시 공유 실현

小云云원래의: 2018-01-13 09:12:196162검색

이 기사에서는 JS를 사용하여 쇼핑몰 플래시 세일과 같은 일부 자동 클릭 기능을 작성하는 방법을 주로 설명합니다. 이러한 측면이 필요한 친구는 아이디어를 빨리 배워야 합니다. 그것이 모두에게 도움이 되기를 바랍니다.

플래시세일 이벤트 페이지 코드를 먼저 살펴보겠습니다

<!DOCTYPE HTML>
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
  <title>
   Micomo
  </title>
 </head>
 <body>
  <p>
   <p>
    活动倒计时<strong id="endtime"></strong>秒！
   </p>
   <input type="button" id="btn" value="立即购买" disabled="disabled" onClick="func()"/>
  </p>
  <script src="/js/jquery-2.1.1.min.js"></script>
  <script type="text/javascript">
   //倒计时30秒
   var i = 30;
   function remainTime() {
    if (i > 0) {
     document.getElementById("endtime").innerHTML = i--;
     setTimeout("remainTime()", 1000);
    }
    if (i == 0) {
     $("p").text("活动开始");
     $("p").css("background-color", "yellow");
     //倒计时结束，按钮状态改为可用
     document.getElementById("btn").disabled = false;
    }
   }
   remainTime();
   //点击按钮触发的方法
   function func() {
    alert("恭喜你抢到一个月饼");
   }
  </script>
 </body>

</html>

페이지 미리보기

JS 스크립트로 웹페이지 자동 플래시 세일 예시 공유 실현

script js

code

<script type="text/javascript">
 var button = document.getElementById("btn");
 //每秒执行一次，若按钮状态为可用，进行点击
 setInterval(function() {
  if (button.disabled == false) {
   button.click();
  }
 },
 1000);
</script>

setInterval() 메소드는 다음과 같습니다. 함수를 호출하거나 표현식을 평가하기 위해 지정된 기간(밀리초)에 따라 사용됩니다.

setInterval() 메서드는clearInterval()이 호출되거나 창이 닫힐 때까지 함수를 계속 호출합니다.

브라우저에 넣는 방법

브라우저에서 액티비티 페이지를 열고 F12를 눌러 디버깅 모드로 들어간 후 콘솔 콘솔을 찾아 위의 js 스크립트 태그에 코드를 붙여넣습니다(첫 번째와 마지막 태그 제외). Enter를 클릭하세요. 이벤트가 끝나기 전에 입력하세요.

JS 스크립트로 웹페이지 자동 플래시 세일 예시 공유 실현