jQuery + PHP加載更多

Question

我面對jQuery的問題

這是我的代碼

<script type='text/javascript' src='jquery-1.10.2.min.js'></script>
<script type="text/javascript">
$(function() {
$(".more2").click(function() {
   var element = $(this);
   var msg = element.attr("id");

    $.ajax({
    type: "POST",
        url: "insta2.php",
        data: "lastmsg="+ encodeURIComponent(msg),  

            success:function (data) {

                $("#morebutton").replaceWith(data);

            }   
});



    return false;
    });
});
</script>



  <span class="more" id="morebutton">
  <a id="1" class="more2" title="Follow" href="#" style="color:#000">
               Read More
</a>
 </span>

這是insta2.php

<?php

if(isset($_POST['lastmsg']))
{
$a=  $_POST['lastmsg'];
$a = $a++;
?>
<br>
  <span class="more" id="morebutton">
  <a id="<?php echo $a;?>" class="more2" title="Follow" href="#" style="color:#000">
    <?php echo $a;?>           Read More
</a> </span>
<?php }?>

我的jQuery只有一個1集，然后每次點擊都無法正常工作

有什么辦法可以繼續計數嗎？

像這樣

閱讀更多1閱讀更多2閱讀更多3閱讀更多4閱讀更多，依此類推...

Answer 1

您的內容內容未附加jquery偵聽器。 基本上，您的jquery將僅在原始HTML上運行。

您可以使用.on（）函數將click事件綁定到始終在頁面上的元素，並使用選擇器參數來定義您的閱讀更多鏈接。 （有關詳細信息，請閱讀jQuery手冊）。

例如：

$('body').on('click', 'span.more', function(){
     // Do your ajax stuff
});

這會將click事件綁定到您的身體，而不是'span.more'，並且適用於添加到身體的任何span.more。

編輯-JS小提琴：

http://jsfiddle.net/g8G83/

Answer 2

<span id="more">
    <a id="1" class="more2" title="Follow" href="#" style="color:#000">
        Read More
    </a>
</span>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript">
    $(function() {
        $(".more2").click(function readmore() {
            var element = $(this);
            var msg = element.attr("id");
            $.ajax({
            type: "POST",
                url: "insta2.php",
                data: "lastmsg="+ encodeURIComponent(msg),  

                    success:function (data) {
                        $("#more").append(data);
                        $(".more2").off("click");
                        $(".more2").on("click",readmore);
                    }   
            });
            return false;
        });
    });
</script>