HTML Code

<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="utf-8">

  <title>ajaxStart global false</title>

  <style>

    body { font-family: sans-serif; padding: 16px; max-width: 560px; }

    button { margin-right: 8px; padding: 8px 12px; cursor: pointer; border-radius: 6px; border: none; color: #fff; }

    #global-btn { background: #2563eb; }

    #private-btn { background: #64748b; }

    .log { margin-top: 14px; padding: 12px; background: #f1f5f9; border-radius: 6px; font-size: 14px; min-height: 40px; }

  </style>

</head>

<body>

  <button type="button" id="global-btn">Global $.get()</button>

  <button type="button" id="private-btn">Private global:false</button>

  <div class="log">Click a button to test ajaxStart.</div>

  <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>

  <script>

    var startCount = 0;



    $(document).on("ajaxStart", function() {

      startCount++;

      $(".log").append(" ajaxStart (" + startCount + ")");

    });



    $("#global-btn").on("click", function() {

      $.get("https://jsonplaceholder.typicode.com/posts/1");

    });



    $("#private-btn").on("click", function() {

      $.ajax({

        url: "https://jsonplaceholder.typicode.com/posts/2",

        global: false

      });

    });

  </script>

</body>

</html>

Lines: 0 | Characters: 0

Live Preview Auto-refresh on Run

jQuery ajaxStart — global:false opt-out (Try It)