예약된 새로 고침 예제의 JQuery 구현

이 기사에서는 주로 JQuery의 예약 새로 고침 구현 예를 공유합니다. 웹 개발에서는 특정 페이지나 데이터의 특정 부분을 지속적으로 새로 고쳐야 하는 경우가 많습니다. 이때 이를 달성하려면 예약된 새로 고침을 사용해야 합니다. 구현은 JS setInterval 함수를 사용하여 정기적으로 데이터를 요청한 다음 요청 결과를 프런트 엔드 HTML로 반환하여 새로 고치는 것입니다.

구현 코드는 다음과 같습니다.

<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
<script>
 $(function(){
  getData();
  setInterval(function(){
   getData();
  }, 3000);
 });
 functiongetData(){
  $.getJSON("/blood/pressure/1", function(data){
   if (200 == data.code) {
    $("#systolic").text(data.data.systolic);
    $("#diastolic").text(data.data.diastolic);
    $("#pulse").text(data.data.pulse);
   }
  });
 };
</script>

코드 설명:

1.Jquery 가져오기

<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>

JQuery 라이브러리를 가져오려면 위의 명령문을 사용하세요. .

2. 페이지가 로드된 후 프로그램 시작

$(function(){
 getData(); // 第一次加载数据
 // 开启定时任务，时间间隔为3000 ms。
 setInterval(function(){
  getData();
 }, 3000);
});

일반적으로 예약된 작업은 페이지가 로드된 후에 시작되어야 합니다. 페이지가 로드될 때 두 가지 이벤트가 있습니다. 하나는 문서 구조가 로드되었음을 나타내는 준비입니다(이미지와 같은 텍스트가 아닌 미디어 파일 제외). 다른 하나는 이미지를 포함한 페이지의 모든 요소를 ​​나타냅니다. 및 다른 파일이 로드되었습니다(onload 전에 :ready가 트리거되었다고 말할 수 있음).

준비되면 예약된 작업을 실행하고 이를 달성하려면 다음 코드를 사용하는 것이 좋습니다.

$(function(){
 // do sometion
});

위 코드는

$(document).ready(function(){ 
 //do something
})

3과 동일합니다. 데이터를 가져오고 페이지를 새로 고칩니다

. 다음 코드를 사용하여 데이터를 얻고 페이지에 해당 값을 설정하십시오. 따라서 페이지 데이터를 새로 고칩니다. 이 단계에서는 필요에 따라 해당 코드를 작성합니다. ㅋㅋㅋ ITnose

위 내용은 예약된 새로 고침 예제의 JQuery 구현의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!