Javascript 在不影响另一页的情况下更改一页的变量_Javascript

Javascript 在不影响另一页的情况下更改一页的变量

javascript

Javascript 在不影响另一页的情况下更改一页的变量,javascript,Javascript,我有一个页面，它使用了一些javascript来制作一些分幅。在一页上，它工作得很好。它有6列平铺，您可以单击每列以显示更多信息我的问题是，我要在另一个页面上使用相同的内容，但只有3列。当我将column变量更改为3时，它会在新页面上工作，但原始页面也会更改。我需要保留第一页的第6列和新的第3列。按照目前的代码方式，对于var per_row=6我只能在第9行中使用一个或另一个，如何在不破坏它的情况下使这两个页面都可以使用 var griddle\u prep=函数（$el）{ if（！$e

我有一个页面，它使用了一些javascript来制作一些分幅。在一页上，它工作得很好。它有6列平铺，您可以单击每列以显示更多信息

我的问题是，我要在另一个页面上使用相同的内容，但只有3列。当我将column变量更改为3时，它会在新页面上工作，但原始页面也会更改。我需要保留第一页的第6列和新的第3列。按照目前的代码方式，对于

var per_row=6

我只能在第9行中使用一个或另一个，如何在不破坏它的情况下使这两个页面都可以使用

var griddle\u prep=函数（$el）{
if（！$el.data（'init'））{
$el.addClass（'griddle-initialized'）；
$el.data（'init'，$el.html（））；
}
};
var griddle_update=函数（$el）{
每行var=6，
窗口宽度=$（窗口）.width（）；
//我们不需要计算高度，只需要借助断点
//要确定每行中有多少项，请参见_gridle.scss
如果（窗口宽度-1）{
//看看我们是不是换了
if（目标行索引===当前行索引）{
//把它换掉就行了
$current_row.remove（）；
$row.after（$target_details）；
$target_details.show（）；
}否则{
//删除不适用的行
$existing_details.slideUp（'fast'，function（））{
$existing_details.remove（）；
});
//显示适用的行
$row.after（$target_details）；
$gridle.find（'.gridle detail display'）.slideDown（'fast'）；
}
}否则{
//没有当前行，请将其向下滑动
$row.after（$target_details）；
$gridle.find（'.gridle detail display'）.slideDown（'fast'）；
}
$this.addClass（'gridle-active'）；
网格位置指示器（$this$target\u details）；
}
});
$gridles.each（函数（）{
var$griddle=$（此）；
//我们将获取网格HTML，因为我们将在调整大小时交换它
griddle_prep（$griddle）；
//初始化行
griddle_更新（$griddle）；
//在调整大小时更新行
$（窗口）。smartresize（函数（）{
griddle_clean_up（$griddle）；
griddle_更新（$griddle）；
});
});
}

一种态度可能是使用

META

标记将此信息包含在页面中，例如，在头部：

<html>
<head>
    <meta name="pageRows" content=3 />
</head>
<body>...</body>
</html>

资料来源：

MDN：
MDN：
MDN：
MDN：
jQuery文档：

通过传递给

var griddle\u prep=function（$el，per\u row\u param）

的参数设置

每行

，并在不同页面上提供不同的值。谢谢。非常有帮助！我使用的是wordpress，两个页面都使用不同的模板，所以我想我会将其添加到那里。设置页面上每行的

值的最佳方法是什么？在您调用griddle\u prep（某物）
的地方，将其更改为griddle\u prep（某物，6）
或griddle\u prep（某物，9）
它们共享同一个头部模板，因此我不想在
中调用它，但感谢您提供的信息，您也可以使用属性，我将更新答案。我可以使用div而不是body吗？当然可以。。与body选项相同。就用一个div。
<body ... pageRows=3> ...

// Meta:
// Using jQuery:
var per_row = $('meta[name="pageRows"]').prop('content');
// Vanilla JS:
var per_row = document.getElementsByName("pageRows").getAttribute('content');

// Element:
// Using jQuery:
var per_row = $('body').prop('pageRows');
// Vanilla JS:
var per_row = document.getElementsByTagName("body").getAttribute('pageRows');

// Don't forget to specify a default, in case the `META` tag doesn't exist.