Как применить переключатель прототипа к содержимому, загружаемому через JSON, проблема только с IE

Question

Я использую PHP и JavaScript через прототип.У меня есть страница комментариев с потоком, которая открыта по умолчанию через вызов JavaScript для данных файла PHP, возвращаемых через JSON, в DB извлекаются только комментарии родителей.(Короче говоря, только комментарии родителей извлекаются из DB и отображаются), затем родители загружаются и отформатированы, чтобы показать на странице ссылку для получения и отображения своих детских комментариев, пример ссылки:

<span id="moreparent8351" onclick="insertChildDiv('parent8351')">1 Replies and more</span>

приведенная выше ссылка на диапазон вызывает функцию javascript «insertChildDiv()», которая в основном получает комментарии с родительским_идом = parent8351, а также использует файл PHP, который возвращает данные через JSON в javascript, который динамически вставляет эти дочерние комментарии, вложенные под его родительский комментарий.тогда ссылка на пролет выше с использованием прототипа преобразуется в:

<span id="moreparent8351" onclick="$('childparent8351').toggle()">1 Replies and more</span>

вот в чем проблема: этот вставленный контент внутри этого div с id=childparent8351 не будет реагировать на переключение скрытия/показа ТОЛЬКО в IE v6, v7 и v8.другие браузеры работают нормально.похоже, что IE не может применить переключатель скрытия/отображения к динамически вставленному содержимому.Я попробовал жестко запрограммировать вставленный контент, который вижу в Fogbugz, на страницу и снова протестировать его в IE, угадайте, что?переключение работает!

Я не хочу получать все комментарии, как родительские, так и дочерние, а затем скрывать дочерние комментарии, это пустая трата ресурсов на что-то, что, как мы не уверены, важно или может быть прочитано пользователями.

Есть ли обходной путь?если его нет, то я надеюсь, что этот пост поможет другим на стадии проектирования чего-то подобного.

Answer 1

Element.toggle() должно нормально работать с динамически генерируемым контентом.Ваша проблема, скорее всего, кроется в метод, который вы используете для создания этого контента.

Вы заявили:

Затем ссылка выше, используя прототип превращается в:

<span id="moreparent8351" onclick="$('childparent8351').toggle()">1 Replies and more</span>

Как именно вы меняете атрибут onclick элемента span?

Прежде всего, я бы определенно не рекомендовал менять событие onclick на лету.Вероятно, лучше использовать одну функцию, которая проверяет текущее состояние того, что вы пытаетесь сделать, и выполняет соответствующий код.

Обязательно не «преобразовывайте» элемент span, включая атрибут onclick, с помощью InnerHTML.Скорее всего, DOM все еще пытается сослаться на функцию, которую вы только что удалили.Если вы вообще обновляете атрибут onclick, сделайте это следующим образом:

var element = $('moreparent8351');
// this automatically removes previous onclick handlers set in this manner
element.onclick = function() { // do stuff };

... или, если вы хотите использовать прототип:

var element = $('moreparent8351');
// OPTIONAL: remove previous handler, if set
element.stopObserving('click', my_cool_function());
// attach  new handler
element.observe('click', function() { // do stuff });