Question

我写了这个全局函数：

    var aSpecimen = 0;

$(function(){
  function prodCarousel(div){
    $(div).find('li.next a').click(function() {
        $(div).find('ul.display li').hide();
        $(div).find('.viewer ul li.img').siblings().removeClass('viewerOn');
        aSpecimen = aSpecimen + 1;

        if (aSpecimen == $(div).find('ul.display li').length + 0)
            aSpecimen = 0;

        if (aSpecimen == $(div).find('.img').length + 0)
            aSpecimen = 0;

        $(div).find('ul.display li:eq(' + aSpecimen + ')').fadeIn("fast");

        $(div).find('.img:eq(' + aSpecimen + ')').addClass('viewerOn');

        return false;
    });

    $('li.prev a').click(function() {
        $(div).find('ul.display li').hide();
        $(div).find('.viewer ul li.img').siblings().removeClass('viewerOn');
        aSpecimen = aSpecimen - 1;

         if (aSpecimen == -1) aSpecimen = $(div).find('ul.display li').length - 1;

        $(div).find('ul.display li:eq(' + aSpecimen + ')').fadeIn("fast");
        $(div).find('.viewer ul li.img:eq(' + aSpecimen + ')').addClass('viewerOn');
        return false;
    });
  }
});

我试图使用以下方法调用它：

    $(document).ready(function() {

      function prodNav(div, self){
        $("#product1, #product2").empty();
        $('#product'+div).load('product'+div+'.html');
        $("ul.prodDetails li a").removeClass("prod1DetailsOn prod2DetailsOn prod3DetailsOn prod4DetailsOn");
        $("ul.prodDetails li.details1 a").addClass('prod'+div+'DetailsOn');
        $("#productsAll nav li a").removeClass("prodMainNav1 prodMainNav2 prodMainNav3 prodMainNav4");
        $(self).addClass('prodMainNav'+div);
        prodCarousel('#product'+div);
      }
    }):

$("#productsAll nav li.prod1 a").click(function(){
  prodNav("1", this);
  return false;
});

$("#productsAll nav li.prod2 a").click(function(){
  prodNav("2", this);
  return false;
});

});

它不起作用。我有什么想法我做错了吗？谢谢，

Answer 1

我不知道这是否是唯一的问题，但这一行：

$('#product'+div).load('product'+div+'.html');

是异步调用。它开始加载产品div中的内容。但是，稍后在同一个执行线程中，你在该div上调用prodCarousel，它看起来就像你期望内容已经存在。它可能还不存在。

您可能必须在加载调用上使用完成函数，并在成功加载后对该内容进行处理。

$('#product'+div).load('product'+div+'.html', function() {
    // call prodCarousel() on the new content here
});

Answer 2

将函数放在$（）中是document.ready（）的简写。 ProdCarousel正在匿名函数的范围内定义 - 只需将其移出它。

全局变量问题

2 个答案: