Загрузка цели ссылки в <DIV>с помощью события jQuery .live в тот же <DIV>?

Question

Я вызываю определенный div с другой страницы с помощью jquery для загрузки в div на моей главной странице следующим образом:

<script type="text/javascript">
$("#scotland").load("http://www.example.com/scotland .gallery");
</script>
<div id="scotland"></div>

Между прочим, div, который я вызываю, - это фрагмент кода, который автоматически генерируется простым модулем CMS.

Теперь дело доходит до моей проблемы: div .gallery, который я называю, выглядит немного упрощенно, например:

<div class="gallery">
    <span><img src="http://www.example.com/scotlandimage1.jpg"></span>
    <span class="imgnavi"><a href="link_to_next_page_with_one_image">Next image</href></span>
</div>

Я хочу, чтобы ссылка "следующее изображение" загружала следующую страницу в div .gallery (это всегда страница с одним изображением). Но он открывает новую страницу только http://www.example.com/scotland.

Я пытался использовать событие jquerys .live для загрузки связанной страницы (это будет "scotlandimage2" и навигация, как вы можете видеть в верхней части - не только изображение!), Но я, должно быть, сделал что-то не так , Я пробовал разные способы, но так и не заработал. Это была моя последняя попытка:

$(".imgnavi a").click(function() {
  var myUrl = $(this).attr("href");
  $(".gallery").load(myUrl);
  return false;
});

Я должен признать, что я новичок в jquery ... Но кто-то знает, что я сделал неправильно (я даже следую за правильными обработчиками?)?

Заранее большое спасибо!

Martin

Answer 1

Ваша первая попытка удалась, но вы пропустили обязательный для ajax-вызов live вместо click:

$('.imgnavi a').live('click', function(ev) {
    // Stop regular handling of "click" in most non-IE browsers
    ev.preventDefault();
    ev.stopPropagation();

    // Load the new content into the div (same code you had)
    $('.gallery').load($(this).attr('href'));

    // Stop regular handling of "click" in IE (and some others)
    return false;
}

РЕДАКТИРОВАТЬ в ответ на вопрос: «Что будет со старым $('gallery') контентом?»

При использовании приведенного выше кода старое содержимое будет заменено ответом на запрос .load(). Если вы хотите, скажем, вместо этого добавить к изображению префикс, вы можете просто обернуть вызов .load() в вызов встроенного метода jQuery $.prepend( content ), например:

$('gallery').prepend($.load($(this).attr('href')));

То же самое работает для добавление .