>source

간단한 jQuery POST 스크립트가 있다고 가정 해 봅시다 :

$(document).ready(function () {
    $.post("post-data.php")
        .done(function (data) {
            // Done function
        }).fail(function () {
            // Fail function
        });
});

이 HTML이 있다고 가정 해 봅시다 :

<div id="page">
    <a href="link.php">Some link</a>
    <div id="jquery-data-response"></div>
</div>

post-data.php가 10 초 후에 데이터를 반환하고 10 초 이내에 "일부 링크"를 클릭하면 jQuery POST 요청이 완료된 후 "link.php"페이지가로드되므로 사용자는 기다려야합니다. 최대 10 초입니다.

이것은 jQuery GET 요청에도 적용됩니다.

이제 두 가지 질문이 있습니다.

  1. 문제는 어디에 있습니까? 서버 문제입니까 (스크립트가 완전히 최적화되어 있고 10 초보다 빠를 수 없으며 XAMPP가있는 localhost에서도 발생 함) jQuery 문제 (사용자 상호 작용을 처리하는 누락 기능입니까) 또는 브라우저입니까? 문제 (모든 요청이 처리되기 전에 Chrome을 기다려야하나요?)
  2. 이 문제를 해결하는 것이 가능합니까 (그리고 방법)?
  • 답변 # 1

    와이즈 비즈

    현재 문제는 요청과 독립적으로 상호 작용을 관리하는 방법입니다. 요청이 이행되기 전에 누군가가 링크를 클릭하지 못하게하려면 링크가 완료 될 때까지 관리해야합니다.

    예를 들어, 코드에서 요청이 해결되었는지 여부를 결정하는 플래그를 선언하십시오. 기본적으로

    Where is the problem?

    . 그런 다음 ajax 쿼리를 실행하십시오. 성공하면 false 를 설정합니다   requestComplete 로 .

    true
    
    

    플래그가 let requestComplete = false; $.post("post-data.php") .done(function (data) { // this will prompt your listener to allow native execution requestComplete = true; }) .fail(function () { ... }); 인 경우에만 상호 작용을 허용하는 링크에 리스너를 바인딩 . 이벤트 핸들러의 반환 값은 기본 브라우저 동작도 수행해야하는지 여부를 결정합니다. 링크를 클릭하는 경우 링크를 따릅니다.

    true
    
    

    그리고 마크 업은 다음과 같이 보일 것입니다 :

    $(document).on('click', '.link', function (event) {
      return requestComplete;
    });
    
    

    브라우저 기본 동작의 차단을 보여 주려면이 바이올린을 살펴보십시오.

    <div id="page"> <a href="link.php" class="link">Some link</a> <div id="jquery-data-response"></div> </div>

  • 이전 python - 경계 및 제약 조건이있는 이산 변수에 대한 함수 최소값 찾기
  • 다음 javascript - XMLHttpRequest가 XXX를로드 할 수 없음 '액세스 제어 허용 원본'