Javascript 按图像Don'过滤；我不想显示所有的图像

我正在创建过滤器图像库。默认情况下，在加载页面时显示所有图像。我有四个不同的标签

1。展示一切2.自然3。汽车4。人

现在，我不想所有的图像显示。默认情况下，我希望在加载页面后默认显示Nature filter图像

请检查我的代码：

另外，附上我的代码

过滤器选择（“全部”）
函数过滤器选择（c）{
变量x，i；
x=document.getElementsByClassName（“列”）；
如果（c==“全部”）c=“”；
对于（i=0；i-1）w3AddClass（x[i]，“show”）；
}
}
函数w3AddClass（元素、名称）{
变量i，arr1，arr2；
arr1=element.className.split（“”）；
arr2=name.split（“”）；
对于（i=0；i-1）{
arr1.拼接（arr1.indexOf（arr2[i]），1）；
}
}
element.className=arr1.join（“”）；
}

*{
框大小：边框框；
}
身体{
背景色：#f1f1；
填充：20px；
字体系列：Arial；
}
/*中心网站*/
梅因先生{
最大宽度：1000px；
保证金：自动；
}
h1{
字体大小：50px；
单词break：打破一切；
}
.行{
利润率：10px-16px；
}
/*在每列之间添加填充*/
一行
.row>列{
填充：8px；
}
/*创建三个相邻浮动的相等列*/
.栏目{
浮动：左；
宽度：33.33%；
显示：无；/*默认情况下隐藏所有元素*/
}
/*清除行后的浮动*/
.罗：之后{
内容：“；
显示：表格；
明确：两者皆有；
}
/*内容*/
.内容{
背景色：白色；
填充：10px；
}
/*“show”类被添加到过滤的元素中*/
.表演{
显示：块；
}

MYLOGO.COM

文件夹
全部展示
自然界
汽车
人
MYLOGO.COM

文件夹
全部展示
自然界
汽车
人
山
Lorem ipsum dolor

灯
Lorem ipsum dolor

森林
Lorem ipsum dolor

复古的
Lorem ipsum dolor

快速的
Lorem ipsum dolor

经典
Lorem ipsum dolor

女孩
Lorem ipsum dolor

成年男子
Lorem ipsum dolor

成年女子
Lorem ipsum dolor

我希望这对您有用：

window.onload = function () {
 document.getElementById('nature').checked=true;
filterSelection('nature');
}

我已创建分叉链接：。

---

如果您的问题仍未解决，请告诉我。

修改js文件中的这一行：

filterSelection("all")

借

并删除已签入的“所有”收音机，添加已签入的“自然”收音机

过滤器选择（“自然”）
函数过滤器选择（c）{
变量x，i；
x=document.getElementsByClassName（“列”）；
如果（c==“全部”）c=“”；
对于（i=0；i-1）w3AddClass（x[i]，“show”）；
}
}
函数w3AddClass（元素、名称）{
变量i，arr1，arr2；
arr1=element.className.split（“”）；
arr2=name.split（“”）；
对于（i=0；i-1）{
arr1.拼接（arr1.indexOf（arr2[i]），1）；
}
}
element.className=arr1.join（“”）；
}

*{
框大小：边框框；
}
身体{
背景色：#f1f1；
填充：20px；
字体系列：Arial；
}
/*中心网站*/
梅因先生{
最大宽度：1000px；
保证金：自动；
}
h1{
字体大小：50px；
单词break：打破一切；
}
.行{
利润率：10px-16px；
}
/*在每列之间添加填充*/
一行
.row>列{
填充：8px；
}
/*创建三个相邻浮动的相等列*/
.栏目{
浮动：左；
宽度：33.33%；
显示：无；/*默认情况下隐藏所有元素*/
}
/*清除行后的浮动*/
.罗：之后{
内容：“；
显示：表格；
明确：两者皆有；
}
/*内容*/
.内容{
背景色：白色；
填充：10px；
}
/*“show”类被添加到过滤的元素中*/
.表演{
显示：块；
}

MYLOGO.COM

文件夹
全部展示
自然界
汽车
人
MYLOGO.COM

文件夹
全部展示
自然界
汽车
人
山
Lorem ipsum dolor

灯
Lorem ipsum dolor

森林
Lorem ipsum dolor

复古的
Lorem ipsum dolor

快速的
Lorem ipsum dolor

经典
Lorem ipsum dolor

女孩
Lorem ipsum dolor

成年男子
Lorem ipsum dolor

成年女子
Lorem ipsum dolor

尝试以下操作：在“自然输入”中添加id，并在“窗口加载”中触发此元素上的单击事件

<input type="radio" onclick="filterSelection('all')"  name="category" checked> Show all
<input type="radio" onclick="filterSelection('nature')" id="nature" name="category"> Nature
<input type="radio" onclick="filterSelection('cars')" name="category"> Cars
<input type="radio" onclick="filterSelection('people')" name="category"> People

window.onload = function(e){ 
    var l = document.getElementById('nature');
   l.click();
}

全部显示
自然界
汽车
人
window.onload=函数（e）{
var l=document.getElementById（'nature'）；
l、 单击（）；
}

您必须使用

window.onload功能

函数过滤器选择（c）{
变量x，i；
x=document.getElementsByClassName（“列”）；
如果（c==“全部”）c=“”；
对于（i=0；i-1）w3AddClass
<input type="radio" onclick="filterSelection('all')"  name="category" checked> Show all
<input type="radio" onclick="filterSelection('nature')" id="nature" name="category"> Nature
<input type="radio" onclick="filterSelection('cars')" name="category"> Cars
<input type="radio" onclick="filterSelection('people')" name="category"> People

window.onload = function(e){ 
    var l = document.getElementById('nature');
   l.click();
}