.load() - как в загруженном содержимом использовать jquery?
Такая проблема встала:
Делаю каталог, там товары выводятся, при клике на товар я вывожу див (наподобие лайтбокса допустим) поверх всего сайта, в этом диве вся информация о данном товаре, эта информация берется из бд (для этого .load). Т.е. у меня есть отдельный скрипт, в котором выводится вот это содержимое дива. И именно его я подгружаю в .load() У каждого товара 3 картинки, и я хочу чтобы в этом подгруженном содержимом можно было покодить что-нибудь с помощью jquery (ну допустим 3 маленькие картинки, одна большая, и хочется прощелкаться по этим картинкам, чтобы они становились большими). Ну это даже не так важно, что именно делать, просто вопрос принципиальный как раз в том, как взаимодействовать с подгруженным содержимым? Я совсем только начал изучать jq, поэтому даже не пробовал, может с $ajax по-другому получится... В любом случае, буду благодарен любым советам. |
А какая разница? Вы получили кусок хтмл, который добавился на страницу и jQuery имеет к нему такой же доступ, как и ко всему прочему. Работайте как и раньше - выбирайте нужные элементы по id или классу и т.д.
Цитата:
|
Цитата:
function loadDiv(){
....
$("#output").load(...); //допустим лоудом вставляем див с id="div"
....
};
$("#div").click(function(){
....
// что-то делает
...
})
При клике по по элементу с id="div", который был подгружен .load()-ом скрипт не сработает, просто не найдет элемент с таким id. PS: в JS начинающий, но с этой проблемой уже сталкивался. |
Во первых функция load(url, data, callback) имеет третий аргумент - функцию где можно что то сделать после прихода ответа с сервера.
Во вторых, то что это
$("#div").click(function ...
не работает - делать:
$("#div").live('click', function ...
|
micscr,
ну, и вот зачем ты плохому учишь человека? Беляш, помещай $("#div").click(function внутри ф-ции обработчике ajax-запроса и вообще, лучше сперва выучи JavaScript Нормально, а потом уже учи jQuery это плохая идея начинать изучение с него |
Цитата:
|
Цитата:
и человек привыкнув будет долго думать почему у него при движении мышкой все тормозит, к примеру к тому же данного случая считаю Live неоправданным и ненужным. |
Цитата:
Начинать изучение языка с одного из его фреймворков - дурной тон, это понятно. Просто так получилось, что пока нет желания/возможности/времени головой окунаться в недры JS, а для верстки и AJAX'а пока вполне достаточно возможностей jQuery. |
Цитата:
Когда использование live будет оправданным? |
Цитата:
Цитата:
- события не связанные с движением мыши, и печатанием на клавиаутуре. хотя есть ситуации, когда в такой ситуации надо повесить live, но надо быть осторожным, так как такое использование может затормозить браузер. Особенно mousemove. - у вас есть достаточно большое количество объектов, для которых надо повесить единый обработчик. например "виртуальная клавиатура", динамическое дерево, выпадающие многоуровневые меню, всякого рода карты с областями, элементы списков чем больше количество однотипных объектов обрабатывается, тем выше скорость при повешении/снятия события - особенно полезно, если эта куча объектов является динамической, и могут исчезать/добавлятся новые объекты. Например AJAX-дерево и главное не забывать снять обработчик события, если на странице уже точно нету ни одного обрабатываемого объекта. кажется все. больше поводов использовать live не вижу ну и уж никак не стоит назначать его для одиночного элемента по id-шнику |
Большое спасибо всем за советы. Сработали оба способа. Но раз уж лайв использовать не советуете, воспользовался callback'ом.
|
$.get("скрипт.php", function (html)
{
$("#div").html(html).obrabotka_diva();
});
jQuery.fn.obrabotka_diva=function ()
{
// Тут вешаются обработчики событий и многое другое...
$(this).find("img").click(function ()
{
...
});
$(this).click(...);
// Тут вешаются обработчики событий и многое другое... End
return this;
};
|
Roboteck,
вы что шутите? расширять jQuery дополнительным методом ради одного вызова?!!! Roboteck, micscr, может поделитесь своими соображениями, чем вы руководствуетесь, когда применяете инструменты предназначенные для массовой обработки, к такого рода задаче по одиночной обработке?! я вижу в ваших действиях в пределах темы, лишь стрельбу из пушки по воробьям |
Я вообще то так не делал раньше, но смотрю красиво выглядит, компактно.
Цитата:
А понимаю ты за такой вариант:
$("#div").html(html);
obrabotka_diva($("#div"));
...
function obrabotka_diva($div){
$div.click(function(){});
...
}
- но те кто не знает jQuery могут позапутываться в куче функций. Хотя это их проблемы, все равно нужно учитывать. |
Спасибо за критику, Вы правы!
Просто я часто использую этот метод для обработки загруженного содержимого, в данном конкретном случае это наверное лишнее, но я отвечал на Цитата:
Загрузить можно самое разное содержимое, в содержимом могут быть ссылки на другие страницы (1, 2, 3, 4, ...) при постраничном выводе, фотографии, форма, которая должна отправить post-запрос и обновить содержимое этого дива, короче очень многое, которое будет заменять содержимое и каждый раз это содержимое можно будет обработать одной функцией, например, если в див будут одновременно вставляться формы, ссылки, фотографии:
$.get("скрипт.php", function (html)
{
$("#div").html(html).obrabotka_diva();
});
jQuery.fn.obrabotka_diva=function () // Обработка дива с разнообразным содержимым
{
var div=this;
$(this).find("a").click(function () // Обработка ссылок
{
var href=$(this).attr("href"); // Запоминаем url ссылки
$(div).html("Загрузка..."); // Пишем в див "Загрузка..."
$.get(href, function (new_html) // Отправляем запрос на url, получаем html-код
{
$(div).html(new_html).obrabotka_diva(); // Вставляем в див новый html-код и обрабатываем его спомощью obrabotka_diva
});
return false; // Останавливаем стандартный клик
});
$(this).find("form").submit(function () // Обработка форм
{
var action=$(this).attr("href"); // Запоминаем url формы
$(div).html("Загрузка..."); // Пишем в див "Загрузка..."
$.post(action, $(this).serialize(), function (new_html) // Отправляем запрос на url, получаем html-код
{
$(div).html(new_html).obrabotka_diva(); // Вставляем в див новый html-код и обрабатываем его спомощью obrabotka_diva
});
return false; // Останавливаем стандартную отправку данных
});
$(this).find(".foto").click(function () // Обработка фотки
{
...
});
return this;
};
|
| Часовой пояс GMT +3, время: 08:17. |