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>