JQuery Ajax частичное обновление страницы

Question

Вот моя простая функция JQuery, чтобы частично обновить страница

<script type="text/javascript"> 
$(document).ready(function() { 
    $("#prevlinkh").click(function() { 
     var pagenumber = $("#prevlinkh").attr("pn"); 
     $("#filelist").load('/uploads/<%=FileCategoryName %>/' + pagenumber + " #filelist>*", ""); 
     return false; 
    }); 

    $("#nextlinkh").click(function() { 
     var pagenumber = $("#nextlinkh").attr("pn"); 
     $("#filelist").load('/uploads/<%=FileCategoryName %>/' + pagenumber + " #filelist>*", ""); 
     return false; 
    }); 
}); 
</script> 

он вызывается из

<a id="prevlinkh" pn="10" href="/uploads/All/10">Previous</a> 
<a id="nextlinkh" pn="12" href="/uploads/All/12">Next</a> 

выше ссылки находятся в сНу (списке файлов), которые обновляются частично ,

Проблема в том, что запрос ajax работает по первому запросу, но не на втором. второй запрос вызывается как обычный щелчок ссылки. Как я понимаю, недавно загруженные следующие и предыдущие ссылки каким-то образом не попадают в DOM.

Как это изменить, чтобы при нажатии следующей/предыдущей ссылки на второй раз вызывается запрос ajax. Надеюсь, мой вопрос достаточно ясен.

Answer 1

Один из самых простых способов является использование live() функции JQuery в:

<script type="text/javascript"> 
$(document).ready(function() { 
    $("#prevlinkh").live('click',function() { 
     var pagenumber = $("#prevlinkh").attr("pn"); 
     $("#filelist").load('/uploads/<%=FileCategoryName %>/' + pagenumber + " #filelist>*", ""); 
     return false; 
    }); 

    $("#nextlinkh").live('click',function() { 
     var pagenumber = $("#nextlinkh").attr("pn"); 
     $("#filelist").load('/uploads/<%=FileCategoryName %>/' + pagenumber + " #filelist>*", ""); 
     return false; 
    }); 
}); 
</script> 

Там также возможность использовать delegate(), который может быть более подходящим для ваших потребностей, но я не полностью уверен.

Answer 2

Проблема в том, что вы привязываете событие click при загрузке документа. Затем, когда элементы заменяются, они перезагружаются без привязки к ним. Вы можете переинсталлировать их или использовать метод live() jQuery.

http://api.jquery.com/live/