0

我正在从数据库中提取一些信息，然后将其放入 DIV 并将所有这些信息注入我的页面。我遇到的问题是在完成加载后定位新注入的 DIV。

这是我的 jQuery：

$j(document).ready(function() {
   $('a#load-content').click(function(event) {
      event.preventDefault();
      var productId = $j(this).attr('id').replace(/more-info-/, '');

      $j.getJSON('../json/quicky/product/id/' + productId, function(json) {
         var productImage = json.image;
         var html = '<div class="quick-info"><img src="' + json.image + '"/></div>';

         $j(body).append(html);   
      });
   });

   $j('div.quick-info').load(function() {
      positionBoxCenter();
   });
});

我尝试在加载内容点击事件之后、getJSON 回调函数内、加载内容点击事件之前以及加载内容点击回调函数内放置快速信息 DIV 的加载事件。我仍然无法让它工作。

我在加载功能上做错了什么？

4

5 回答 5

1

将其放置在您已经拥有的成功处理程序中：

  $j.getJSON('../json/quicky/product/id/' + productId, function(json) {
     var html = '<div class="quick-info"><img src="' + json.image + '"/></div>';

     $j('body').append( html );
     positionBoxCenter();
  });

加载的问题是你必须在元素完全加载之前制作这个处理程序......我从来没有使用过它，因为那很痛苦:)

就我个人而言，我会写positionBoxCenter一个快速的 jQuery 插件，并做更多这样的事情：

  $j.getJSON('../json/quicky/product/id/' + productId, function(json) {
     var html = $j('<div class="quick-info"><img src="' + json.image + '"/></div>');
     // so now html is actually a jquery extended element
     html.positionBoxCenter();
     $j('body').append( html );
  });

这样，您甚至可以在将其添加到 dom 之前使用 jQuery 设置它的定位。或者，您可以尝试在附加之前附加该负载处理程序（您仍然需要扩展元素）。

于 2009-11-18T15:02:32.360 回答
0

尝试使用$().live

   $j('div.quick-info').live('load', function() {
      positionBoxCenter();
   });

使用 jQuery 1.3.2，因为div.quick-info在您尝试绑定时不存在load

也仅供参考..一般来说，$('#load-content')选择比$('a#load-content')

于 2009-11-18T15:05:58.560 回答
0

问题是您试图在这样的元素存在之前将事件处理程序绑定到“div.quick-info”。（当 $(document).ready() 执行时，还没有添加 div）

使用 thennduks 建议在成功处理程序中完成操作。

于 2009-11-18T15:07:02.973 回答
0

您正在准备好的函数中创建您的 div，一旦单击 a#load-content 就会调用该函数。

但是，您正在立即设置加载事件。该 javascript 将在页面加载时执行，这将在 div 实际创建之前进行。

我会将它放在 getJSON 函数的末尾，如下所示：

$j.getJSON('../json/quicky/product/id/' + productId, function(json) {
     var productImage = json.image;
     var html = '<div class="quick-info"><img src="' + json.image + '"/></div>';

     $j(body).append(html);   
     positionBoxCenter();
  });
于 2009-11-18T15:07:33.333 回答
0

load 事件不适用于 div，因为它根本没有加载。

完全跳过加载事件，只需将定位元素的代码放在将元素添加到正文的代码之后。

于 2009-11-18T15:07:35.017 回答