2010-04-14 3 views
1

У меня возникли проблемы с тем, чтобы IE7 сохранял событие клика связанным с элементом, который добавлен в DOM. нагрузка(). Вот код:IE 7 не может связывать событие (используя .live()) с динамически созданным элементом, используя .load()

$('.mybtn').live('click', function(e){ 
    e.preventDefault(); 
    $('#mypage').load('load-this-page.htm'); 
}); 

А вот HTML

<div id="mypage"> 
    <a href="#" class="mybtn">clickme</a> 
    // stuff goes here 
</div> 

При загрузке страницы за клик работает, но после того, как ДИВ загружается по ссылке ClickMe щелчок перестает работать в IE7. Ссылка clickme находится в пределах загрузки div, а также в загруженном html-файле load(), поэтому я использую live().

Этот код работает в FF 3.6, fyi.

У кого-нибудь есть идеи, что случилось (кроме того, что IE отсасывает шары)? Благодаря!

EDIT: вот что загружает в DIV

<ul> 
    <li> 
     <a href="02-01-2010" id="prev-month" class="mybtn"></a> 
    </li> 
    <li> 
     <h3>March 2010</h3> 
    </li> 
    <li> 
     <a href="04-01-2010" id="next-month" class="mybtn"></a> 
    </li> 
</ul> 

<a href="#">link 1</a> 
<a href="#">link 2</a> 
<a href="#">link 3</a> 
<a href="#">link 4</a> 
+2

Что именно находится в ответе на вызов «load()»? Является ли это фрагментом HTML, который содержит тег '', или это полная страница (то есть страница, начинающаяся с '' и т. Д.)? – Pointy

+0

Pointy -Thanks! Это всего лишь небольшая часть html, которая включает в себя ul, li и некоторые ссылки, включая эту ссылку. clickme petron

ответ

1

Попробуйте это:

$('#mypage').load('load-this-page.htm #DivOrWrapper'); 
+0

Simeon - Спасибо, но не ваше предложение по загрузке только части страницы? Файл, загружаемый в div, имеет только несколько ul, li и некоторые ссылки, в том числе один для перезагрузки этого div-Make смысла? – petron

+0

Да, я предложил это, если вы загрузили полный HTML-файл, и это решит проблему. Но если это не так, то могу ли я также увидеть код для страницы, которую вы загружаете? – Simeon

+0

Вы можете попробовать обернуть свой контент в div или заменить * # DivOrWrapper * выше на * body * – Simeon

0

С API documentation, страницу вы загружаете ("нагрузка-это-page.htm") не может быть полным HTML-документом, то есть он не может содержать <html>, <title> или <head> элементов, в противном случае совместимость между браузерами не гарантируется.

+0

Peter-спасибо за ответ. Нет, это не полный html-документ. Это небольшой фрагмент кода, в котором нет ничего, кроме ul и li и некоторых ссылок.Одна из ссылок должна перезагрузить этот небольшой файл обратно в div – petron

0

Возможно, это связано с ограничениями браузера IE. Вот цитата из jQuery Docs:

Из-за ограничений безопасности браузера большинство запросов «Ajax» подчиняются same origin policy; запрос не может успешно извлекать данные из другого домена, субдомена или протокола.

Это означает, что вы не можете сделать $ груз:

0

Попробуйте это:

var fn = function(e) { 

    e.preventDefault(); 
    $('#mypage') 
     .load('load-this-page.htm') 
     .find('.mybtn') 
     .click(fn); 
}; 

$('.mybtn').live('click', fn);