我正在尝试创建一个菜单,根据我制作的自定义按钮(只是可点击的文本)过滤结果。有没有人知道用自定义按钮而不是复选框创建过滤结果菜单的方法?任何帮助都会很棒!
我找到了使用复选框过滤结果的示例:
JSfiddle of filter results using check-boxes
作为一个例子,我将自己的按钮包含在复选框示例的格式中。
<script>
var Lst;
function changecolor(obj) {
if (Lst) Lst.style.color = "#663399";
obj.style.color = "red";
Lst = obj;
}
</script>
body {
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 11px;
line-height: 14px;
}
a:link {
text-decoration: none;
color: #000000;
}
a:visited {
color: #000000;
text-decoration: none;
}
a:hover {
text-decoration: none;
color: #0724fb;
}
a:active {
text-decoration: none;
color: #000000;
}
li {
list-style-type: none;
margin: 0;
padding: 0;
}
ul {
list-style-type: none;
margin: 0;
padding: 0;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="#" onclick="changecolor(this)">
<li>1 bedroom</li>
</a>
<a href="#" onclick="changecolor(this)">
<li>2 bedrooms</li>
</a>
<a href="#" onclick="changecolor(this)">
<li>3 bedrooms</li>
</a>
<br>
<a href="#" onclick="changecolor(this)">
<li>london</li>
</a>
<a href="#" onclick="changecolor(this)">
<li>new york</li>
</a>
<a href="#" onclick="changecolor(this)">
<li>paris</li>
</a>
<br>
<ul>
1 bedroom apartment paris
<br>1 bedroom apartment
<br>3 bedroom apartment london
<br>2 bedroom apartment new york
<br>2 bedroom apartment paris
<br>2 bedroom apartment london
<br>3 bedroom apartment new york
<br>1 bedroom apartment london
<br>2 bedroom apartment new york
</ul>
答案 0 :(得分:1)
根据您提供的复选框示例,我刚刚更新了代码,而是使用您在所选项目上切换的类,从而允许您根据需要设置样式。
请参阅小提琴http://jsfiddle.net/bdum8euw/1/
<iframe src='@Url.Action("ActionName", "ControllerName")'></iframe>