2

我正在开发一个新项目http://www.hotwirerevealed.com，它揭示/识别 hotwire.com 上的酒店。输入状态和目的地后，我有一个使用 jquery 的 .post 方法发布的 javascript 函数。发布请求转到输出 html 的 php 页面，我使用 jquery 的 html 方法将内容放置在页面上。

像这样

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&amp;q=Amerisuites+Northeast+Orlando+(Airport+MCO)">Amerisuites Northeast</a>

我试图使用 jquery 的花哨的盒子，但花哨的盒子

$(document).ready(function(){
    $(".hotel").fancybox({
        'width'             : '75%',
        'height'            : '75%',
        'type'              : 'iframe'
    });
});

但它似乎不起作用，我猜是因为 jquery 不知道那里的元素？我尝试使用 jquery live() 方法收效甚微，任何帮助将不胜感激，提前感谢

4

2 回答 2

3

我这样做的最快方法是将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'
      });
  });
});
于 2010-04-18T02:12:01.800 回答
1

为了清楚起见， $("#details").html(data) 加载“a”标签对吗？

上次我检查时，fancybox() 要求元素已经存在于 DOM 上。当 $(document).ready 触发时， $(".hotel") 可能还不存在。您可以在 $.post 之后移动 fancybox 设置，例如：

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 调用的元素。那里可能会有一些并发症。

于 2010-04-18T01:38:16.923 回答