I have code that displays the contents of the link when I click on the button. But how to display the contents of the link when scrolling the page?

$(function() { $('#button').click(function() { $.ajax({ type: "POST", url: 'https://docs.google.com/forms/d/e/1FAIpQLScBdfQmMdOt1cwpuqwg7uPYQS295zY0vnCRo', success: function(data) { $('#result').html(data); } }); }); });
  • one
    Instead of click, use scroll - Nilsan
  • @scroll and what threshold is scrolled into the scrolling function, in other words how many pixels do you need to scroll to work? - AndSol
  • The scrolling event is triggered every time it scrolls. Alternatively, you can use .one () to work only on the first scroll. Or scroll to add scrollTop check function - Nilsan
  • @Nilsan function did not work - AndSol
  • You did everything right? - Nilsan

1 answer 1

 $(function() { $(window).one("scroll", function() { $.ajax({ type: "GET", url: 'https://jsonplaceholder.typicode.com/posts/4', success: function(data) { $('#result').html(data.title); } }); }); }); 
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div id="result" style="height:2000px;"></div> <button id="button">click</button>

As an example, scroll down and the answer from ajax will appear at the top, it will work once at the first scroll.