2

我有一段代码，里面没有复杂的东西，它基于三个不同的数字（在我的例子中是视口宽度）：

if(viewport_width > 1224) {
    $(".shop-items-navigation").initiate_shop({ containerID: "shop-items-wrapper", perPage: 8 }, function(pages){
        current_page = pages.current;
        total_pages = pages.count;
    });
}
if(viewport_width < 1224 && viewport_width > 954) {
    $(".shop-items-navigation").initiate_shop({ containerID: "shop-items-wrapper", perPage: 6 }, function(pages){
        current_page = pages.current;
        total_pages = pages.count;
    });
}
if(viewport_width < 954 && viewport_width > 624) {
    $(".shop-items-navigation").initiate_shop({ containerID: "shop-items-wrapper", perPage: 4 }, function(pages){
        current_page = pages.current;
        total_pages = pages.count;
    });
}
if(viewport_width < 624) {
    $(".shop-items-navigation").initiate_shop({ containerID: "shop-items-wrapper", perPage: 2 }, function(pages){
        current_page = pages.current;
        total_pages = pages.count;
    });
}

所以我虽然（一种方法）将这三个数字放在这样的数组中：

var widths = [1224, 954, 624];

并在其上应用 foreach 函数后：

for(var i in widths ) {
   ...
}

但我真的不知道如何将这三个数字包装起来。唯一会根据数组中的数字变化的是另一个数字：

{ ... perPage: 6 ... }

可以从 8 到 2 不等。如果可能的话，我希望得到一点帮助，或者换一种写法就好了。

4

3 回答 3

5

您可以制作一个对象列表：

var limits = [
  { min: 1224, perPage: 8 },
  { min: 954, perPage: 6 },
  { min: 624, perPage: 4 },
  { min: 0, perPage: 2 }
];

然后：

for (var i = 0; viewport_width <= limits[i].min, i++);
$(".shop-items-navigation").initiate_shop({ containerID: "shop-items-wrapper", perPage: limits[i].perPage }, 
   function(pages){
      current_page = pages.current;
      total_pages = pages.count;
 });
于 2012-05-15T18:44:43.200 回答
2

尝试以下

var page;
if (viewport_width > 1224) {
  page = 8;
} else if (viewport_width > 954) {
  page = 6;
} else if (viewport_width > 624) { 
  page = 4;
} else {
  page = 2;
}

$(".shop-items-navigation").initiate_shop({ containerID: "shop-items-wrapper", perPage: page }, function(pages){
    current_page = pages.current;
    total_pages = pages.count;
});
于 2012-05-15T18:45:28.010 回答
0

我会做类似下面的事情，

也是全部if..if..还是else If？我认为应该是if..else if..

if(viewport_width > 1224) {
    initShop(pages, 8);
} else if(viewport_width >= 954) {
    initShop(pages, 6);
} else if(viewport_width >= 624) {
    initShop(pages, 4);
} else if(viewport_width < 624) {
    initShop(pages, 2);
}    

function initShop(pages,perPage) {
      $(".shop-items-navigation").initiate_shop({ containerID: "shop-items-wrapper", perPage: 8 }, function(pages){
        current_page = pages.current;
        total_pages = pages.count;
    });

}

编辑：更新if..if，else if因为它更有意义.. 还将条件更改>=为涵盖所有范围。

原始帖子：包含所有if..if

if(viewport_width > 1224) {
    initShop(pages, 8);
}
if(viewport_width < 1224 && viewport_width >= 954) {
    initShop(pages, 6);
}
if(viewport_width < 954 && viewport_width >= 624) {
    initShop(pages, 4);
}
if(viewport_width < 624) {
    initShop(pages, 2);
}    

function initShop(pages,perPage) {
      $(".shop-items-navigation").initiate_shop({ containerID: "shop-items-wrapper", perPage: 8 }, function(pages){
        current_page = pages.current;
        total_pages = pages.count;
    });
于 2012-05-15T18:45:55.637 回答