例如
查询条件:(口 为复选框)
班级: 口 一班 口 二班 ...
学号: 口 一号 口 二号 ...
左边是查询条件,右边是图片,如果没有选择查询条件则显示全部图片
如果选择了查询条件则实时查询符合条件的图片并显示
求给点思路啊,各位大大们
图片用属性记录下班级和学号,如下
<img cls="一班" num="1号"/>
然后jquery
$(function () {
$('班级checkbox 复选框选择器,学号checkbox 复选框选择器').click(function () {
var clscb = ',' + $('班级checkbox 复选框选择器:checked').map(function () { return this.value }).get().join(',') + ','
var numcb = ',' + $('学号checkbox 复选框选择器:checked').map(function () { return this.value }).get().join(',') + ','
$('图片选择器').hide().each(function () {
if (clscb == ',,' && numcb == ',,') this.style.display = ''//没有选中任何
else {
var cls = this.getAttribute('cls')
var num = this.getAttribute('num')
var show = true;
if (clscb != ',,' && clscb.indexOf(',' + cls + ',') == -1) show = false;
if (show && numcb != ',,' && numcb.indexOf(',' + num + ',') == -1) show = false;
if (show) this.style.display = '';
}
})
});
});
版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。