JQuery :이 더 많은 기능로드가 작동하지 않는 이유는 무엇입니까?

Question

jquery로 간단한 "더 많은 기능 불러 오기"를 구현하려고합니다. 아이디어는 페이지를 사용하는 것과 같은 방식으로 사용하는 것입니다. 클릭하고 데이터베이스에서로드 된 특정 개수의 게시물이 표시됩니다.

나는 다음과 같은 자바 스크립트가 :

$(function(){ 
    var count = 0; 
    var num = 20; 
    $("#contents").load("posts.php"); 
    $("#more").click(
function(){ 
var count = 0; 
var num = 20; 
$("#contents").load("posts.php"); 
$("#more").click(
     function(){ 
       $(".loading").show("fast"); 
         count += num; 
         $.post("posts.php", {'page': count}, function(data){ 

             $("#contents").append(data); 
             $(".loading").hide("slow"); 
           }); 

       } 

); 

다음과 같은 파일 posts.php

<? 
echo "hello"; 
?> 

을 그리고 난을 클릭하면 내가

<div id="contents"></div> 
<div class="loading"><span style="text-decoration: blink;">LOADING...!</span></div> 
<button id="more">More..</button> 

와 다른 파일 page.php가 "더 많은 버튼"은 아무런 일도 일어나지 않지만, 나는 여기서 단순한 안녕하세요 세상을 인쇄하려고합니다. 파일의 머리 부분에 자바 스크립트를로드했습니다.

구현 한 다른 javascript 기능이 정상적으로 작동합니다. page.php의 "loading"또는 "contents"요소에 추가 할 것이 있습니까?

Answer 1

자바 스크립트는 기본 구문 구조가 없으며 여기에 게시하는 동안 구문 오류를 발생시켜야합니다.

$(function(){ 
    var count = 0; 
    $("#more").click(loadPosts); 
    loadPosts(); 

    function loadPosts() { 
     var num = 20; 
     $(".loading").show("fast"); 
     count += num; 
     $.post("posts.php", {'page': count}, function(data){ 
      $("#contents").append(data); 
      $(".loading").hide("slow"); 
     }); 
    } 
}); 

UPDATE

위의 코드를 편집하고 $("#contents").load("posts.php");을 제거 :이보십시오. 필요없고 중복되었습니다.