JQuery Tabs и Ajax - как мне настроить страницы? - PullRequest
Новая
       11

JQuery Tabs и Ajax - как мне настроить страницы?

2 голосов
/ 04 августа 2009

Я начал использовать вкладки пользовательского интерфейса jQuery, и они по большей части прекрасно работают, но у меня были некоторые проблемы. Когда я переключаюсь между вкладками, функциональность некоторых элементов теряется, когда я возвращаюсь на эту вкладку. Это привело меня к вопросу, правильно ли я все это структурировал. Поиск в Google ничего не дал, поэтому я решил спросить здесь.

Итак, вопрос: если у меня есть страницы, которые я загружаю через Tab + AJAX, и на этих новых страницах есть функции, с которыми я хочу использовать jQuery, куда мне поместить этот jQuery? Моя структура сейчас выглядит следующим образом:

Страница с вкладками: main_page.php На этой странице есть две вкладки: одна, которая загружает "page1.php" через AJAX, а другая - "page2.php".

page1 имеет свои собственные элементы, на которых я затем использую jQuery. Куда уходит этот код jQuery? Это идет на main_page.php или на page1.php?

Прямо сейчас я помещаю это на страницу 1, что я считаю правильным, но это создало другие проблемы, поэтому я просто хотел еще раз проверить и убедиться, что это правильно.

1 Ответ

1 голос
/ 04 августа 2009

пожалуйста, поместите весь свой javascript в отдельный файл .js. Отдельные данные (html), представление (css) и поведение (javascript, flash ...). Это облегчит обслуживание и масштабирование вашего приложения. Ваши и другие люди, которым однажды придется его поддерживать.

Что касается вашей проблемы: поскольку вы переключаете вкладки, к новому загруженному контенту не будет привязано никакого поведения. Зачем? когда вы впервые загружаете свою страницу и, таким образом, загружаете свой javascript, он будет применяться только к текущему состоянию DOM (структура html, если хотите). Когда вы нажимаете на другую вкладку, вы загружаете свой контент через ajax, чтобы страница не обновлялась, а это означает: к этому новому контенту не будет применен этот javascript, так как он был недоступен, когда javascript был запущен в первое место. Итак, у вас есть 2 варианта:

  • вставьте этот javascript вместе с загруженным html (после него). Это плохая практика, но она работает.
  • вы используете функцию jquery live () для привязки событий. Это правильный выбор.

С помощью live () поведения будут всегда присоединены к элементам DOM.

так вместо 

$('#myel').bind('click',dothis());

вы делаете 

$('#myel').live('click',dothis());

Таким образом, независимо от того, какая вкладка отображается, ее содержимое будет связано с функцией, без необходимости ее повторного подключения.

...