$ .post()请求后,jQuery的ajax和div重复

时间:2014-06-10 21:30:55

标签: javascript jquery ajax

我对jQuery有点问题。我有一个PHP文件,我有我的分页 名单。这个文件有这样的脚本:

    <script>
    <?php if(isset($string)){ ?> var str = "<?php echo $string; ?>"; <?php } ?>
    var off = "<?php echo $offset; ?>";
    var npp = "<?php echo $num_per_page; ?>";

    $('a[id=pagination]').click( function (e) {
    e.preventDefault();
    $.get($(this).attr('href'),<?php if(isset($string)){ ?> { st : str },<?php } ?> function (data){ $('#pagination').empty(); $('#pagination').hide().html(data).fadeIn(); });
    });
    </script>

在加载此页面后,此文件中的内容将使用ajax方法添加到页面中的div。 该内容中的脚本位于#pagination div之后(也属于此内容)。

问题是,在点击链接后,脚本会在第一个#pagination div中创建另一个#pagination div,并且在第二个副本上一切正常。为什么会发生这种情况以及如何解决这个问题,因为我不希望这样的嵌套div?

1 个答案:

答案 0 :(得分:1)

这种情况正在发生,因为AJAX服务器正在返回包含#pagination DIV的HTML,并且您正在使用$("#pagination").html()将其放入具有该ID的现有DIV中。

您有多种选择:

  1. 更改服务器脚本,使其仅返回内容,而不是#pagination DIV。
  2. #pagination附近添加容器DIV,例如#paginationContainer,并使用$("#paginationContainer").html(data)
  3. 使用replaceWith代替html,因此您会覆盖整个DIV而不是内容。
  4. 顺便说一句,在使用.empty()之前,您不需要使用.html(),因为后者完全取代了内容。