jQuery 텍스트 표시 일정 시간 후 숨기는 방법 분석

1594 단어
본고의 실례는 jQuery가 텍스트를 한동안 표시한 후에 숨기는 방법을 설명한다.여러분에게 참고하도록 공유하겠습니다. 구체적으로는 다음과 같습니다.
button을 눌렀을 때 알림 메시지가 표시됩니다. 8초 후 정보가 숨겨집니다.





jQuery(document).ready(function(){
  jQuery(document).on('click', 'input#place_order', function(){
    jQuery(".after_submit_remind").show().delay(8000).hide(0);
  });
});


확장: 초당 시간 자동 1 감소;
text의 "8"을 "9"로 변경합니다.

jQuery(document).on('click', 'input#place_order', function(){
  jQuery(".after_submit_remind").show().delay(8000).hide(0);
  jQuery(function (){
    reduceTime();
  });
  function reduceTime() {
    var auto_reduce = jQuery("#auto-time").html();
    if(auto_reduce == 0){
      jQuery("#auto-time").html("9");
    }else{
      jQuery("#auto-time").html(--auto_reduce);
      setTimeout(reduceTime,1000);
    }
  };
});/*   8s  content*/


관심 있는 친구는 다음 도구를 사용하여 이러한 코드 실행 효과를 테스트할 수 있습니다.
온라인 HTML/CSS/JavaScript 코드 실행 도구:http://tools.jb51.net/code/HtmlJsRun
온라인 HTML/CSS/JavaScript 프런트엔드 코드 디버그 실행 도구:http://tools.jb51.net/code/WebCodeRun
더 많은 jQuery에 관한 내용은 본 사이트의 주제를 보실 수 있습니다.,,,,,,,,,,,,,
본고에서 서술한 것이 여러분의 jQuery 프로그램 설계에 도움이 되었으면 합니다.

좋은 웹페이지 즐겨찾기