Я работаю над новым проектом http://www.hotwirerevealed.com, который показывает / идентифицирует отели на сайте hotwire.com. После ввода состояния и адресата у меня есть функции javascript, которые используют метод .post jquery для публикации. Почтовый запрос отправляется на страницу php, которая выводит html, html метод se se jquery для размещения контента на странице.
вот так
function post(){ $.post("lookup.php", {action: "find", area: area, stars: stars, amenities: amenities, state: $('#state').val()}, function(data){ $("#details").html(data); }); } У меня есть гиперссылки на отели, которые я люблю использовать в световой коробке
<a class="hotel" href="http://google.com/search?btnI=1&q=Amerisuites+Northeast+Orlando+(Airport+MCO)">Amerisuites Northeast</a>
Я пытаюсь использовать причудливую коробку jquery, но причудливый бокс
$(document).ready(function(){ $(".hotel").fancybox({ 'width' : '75%', 'height' : '75%', 'type' : 'iframe' }); });
но, похоже, это не работает, я думаю, потому что jquery не знает элемента, который там есть? Я пытался использовать метод jquery live () с небольшим успехом, любая помощь была бы оценена, спасибо заблаговременно
Просто чтобы быть ясным, $ («# details»). Html (data) загружает теги «a»?
В прошлый раз, когда я проверил, fancybox () требует, чтобы элемент уже существовал в DOM. Когда $ (document) .ready fire, $ (". Hotel"), вероятно, еще не существует. Вы можете переместить настройки fancybox после $ .post, например:
function post(){ $.post("lookup.php", {action: "find", area: area, stars: stars, amenities: amenities, state: $('#state').val()}, function(data) { $("#details").html(data); // bind fancy box $(".hotel").fancybox({ 'width' : '75%', 'height' : '75%', 'type' : 'iframe' }); }); }
Возможно, вам придется следить за вызовом fancybox для элементов, которые уже были вызваны с fancybox. Там могут быть некоторые осложнения.
Самый быстрый способ сделать это – добавить плагин livequery на страницу,
а затем вместо вашего:
$(document).ready(function(){ $(".hotel").fancybox({ 'width' : '75%', 'height' : '75%', 'type' : 'iframe' }); });
сделай это:
$(document).ready(function(){ $(".hotel").livequery(function(){ $(this).fancybox({ 'width' : '75%', 'height' : '75%', 'type' : 'iframe' }); }); });