POST에서 스크롤 사용 안 함

Question

POST를 사용하여 mySQL에서 데이터를 검색하는 페이지가 있습니다. 그러나 스크롤을 내려 POST를하는 무언가를 클릭하면 끝까지 페이지가 다시 움직이기 때문에 짜증이납니다. 누구든지이 문제를 해결할 수있는 몇 가지 javascript/jquery 플러그인을 알고 있습니까?

Answer 1

Jumping Inside Pages을 사용해 보셨습니까?

또 다른 예를 How To Link to a Specific Spot on a Page

<div id="whatever-you-want-to-call-it"> 
    The content of your div here. 
</div> 

및 URL은 그 시점

http://www.pagename.html#whatever-you-want-to-call-it 

Answer 2

글쎄, 당신이 할 경우 AJAX POST에 도착하고, AJAX에서 어떤 결과가있는 페이지의 내용을 대체하는 POST,이 스크롤 효과는 문제가되지 않습니다.

이 작업은 사용자가 원활하게 수행 할 수 있습니다 (브라우저를로드하지 않음).

의이 폼이 있다고 가정 해 봅시다 :

<form id="some_form" action="myphp.php"> 
    <input name="something" value="foo"/> 
    <input name="something_else" value="bar" /> 
</form> 

및 jQuery를 :

$("#some_form").submit(function() { 
    var url = $(this).attr("action"); 
    var form_data = $(this).serialize(); 
    // post the same data via an AJAX call 
    $.post(url, form_data, function(data) { 
     // replace the contents from the received response 
     $("html").html(data); 
    }); 
    // disable the default form submit behavior 
    return false; 
}); 

Answer 3

그것은 e.preventDefault를 사용하는 것이 더 명확를(); jQuery (Uku Loskit이 제안한 것과 같다). 그의 코드에 실수가 있습니다 (작동하지 않을 것입니다). 그래서 수정했습니다.

<form id="some_form" action="myphp.php""> 
    <input name="something" value="foo"/> 
    <input name="something_else" value="bar" /> 
</form> 

및 jQuery를 : 여기에

그의 변화에 ​​코드 그런데

$("#some_form").submit(function(e) { // e = event object, it has many usefull properties and methods 
    e.preventDefault(); 
    var url = $(this).attr("action"); 
    var form_data = $(this).serialize(); 
    // post the same data via an AJAX call 
    $.post(url, form_data, function(data) { 
     // replace the contents from the received response 
     $(document).html(data); 
    }); 
}); 

, 당신이 숙박 할 경우 자바 스크립트없이 그것을 달성하는 방법을 방법이 없습니다 같은 페이지 (재로드하지 말고 URL을 변경하지 마십시오). 페이지 매김과 같이 사용하는 경우 url 뒤에 # some-id를 추가 한 다음 페이지가로드 될 때 상단에 있어야하는 항목에 'some-id'ID를 추가 할 수 있습니다. 이것은 잘 작동 할 것이고 js는 필요하지 않습니다. scrollTop를 사용

Answer 4

시도 :

$("#some_form").submit(function() { 
    var url = $(this).attr("action"); 
    var form_data = $(this).serialize(); 
    var currentScrollTop = $('body').scrollTop(); 

    // post the data via an AJAX call 
    $.post(url, form_data, function(data) { 
     // replace the contents from the received response 
     $(document).html(data); 
     $('body').scrollTop(currentScrollTop); 
    }); 

    // disable the default form submit behavior 
    return false; 
});