Question

在另一个问题的讨论中，我意识到拦截点击和更新区域而不刷新整个页面。问题是，以下代码对我来说似乎是正确的，我没有收到任何错误，但从其他页面获取的数据根本不显示。请指教。

主页

    $('ul.thumbs li.pagination a').live('click', function() { 
        var pageNumber = parseInt($(this).text().replace(/[^0-9]/g, ''));

     $(function ViewImages() {
      $.ajax({
       type: "GET",
       url: "/FLPM/cp/images.cs.asp?Process=ViewImages&PAGEID=" + pageNumber,
       success: function(data) {
        $("#ViewImages").html(data);
       },
       error: function (XMLHttpRequest, textStatus, errorThrown) {
        $("#ViewImages").html('.');
       }
      });
     });

        return false;
    });

<div id="ViewImages">                                       
</div>

数据所在的页面

      <ul class="thumbs">

        <li>
         <a href="#" class="thumb"><img src="/FLPM/media/news/images/5P2B4K5M_sm.jpg" alt="Forest Flowers" class="floatLeft" /></a>
            <br />
          <a href="?Process=DeleteImage&IMAGEID=21" class="thumb"><span class="floatLeft">DELETE</span></a>
  </li>

        <li>

         <a href="#" class="thumb"><img src="/FLPM/media/news/images/6Z3L5U6W_sm.jpg" alt="Forest" class="floatLeft" /></a>
            <br />
          <a href="?Process=DeleteImage&IMAGEID=20" class="thumb"><span class="floatLeft">DELETE</span></a>
  </li>

        <li>
         <a href="#" class="thumb"><img src="/FLPM/media/news/images/8O5A7J8M_sm.jpg" alt="Dock" class="floatLeft" /></a>
            <br />
          <a href="?Process=DeleteImage&IMAGEID=19" class="thumb"><span class="floatLeft">DELETE</span></a>

  </li>

        <li>
         <a href="#" class="thumb"><img src="/FLPM/media/news/images/9Q6B3Q4S_sm.jpg" alt="Desert Landscape" class="floatLeft" /></a>
            <br />
          <a href="?Process=DeleteImage&IMAGEID=18" class="thumb"><span class="floatLeft">DELETE</span></a>
  </li>

        <li>

         <a href="#" class="thumb"><img src="/FLPM/media/news/images/5B2N4W5Z_sm.jpg" alt="Creek" class="floatLeft" /></a>
            <br />
          <a href="?Process=DeleteImage&IMAGEID=17" class="thumb"><span class="floatLeft">DELETE</span></a>
  </li>

        <li class="pagination">1.&nbsp;</li>

        <li class="pagination"><a href="2">2.</a>&nbsp;</li>

 </ul>

Answer 1

在我看来，你的功能定义是不必要的。也许这会更好用：

$('ul.thumbs li.pagination a').live('click', function() { 
   var pageNumber = parseInt($(this).text().replace(/[^0-9]/g, ''));

   $.ajax({
      type: "GET",
      url: "/FLPM/cp/images.cs.asp?Process=ViewImages&PAGEID=" + pageNumber,
      success: function(data) {
         $("#ViewImages").html(data);
      },
      error: function (XMLHttpRequest, textStatus, errorThrown) {
         $("#ViewImages").html('.');
      }
   });

   return false;
});

Answer 2

您提供的HTML中缺少分页类。 $（'ul.thumbs li。分页 a'）

jquery拦截

2 个答案: