如果元素的数据等于选择值

时间:2018-10-02 22:20:14

标签: jquery html

$('.seltop').change(function(){
$('.title').hide();
var a = $('#selfirst').val();
var b = $('#selsecond').val();
$('.title').each(function(){
// if ($(this).has any of data equal to a or b)) {$(this).show();
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class='title' data-a='gold' data-b='silver' data-c='sky'>lorem</div>
<div class='title' data-a='moon' data-b='sun' data-c='river'>lorem</div>
<div class='title' data-a='octet' data-b='double' data-c='single'>lorem</div>

<select class='seltop' id='selfirst'>
<option>gold</option>
<option>moon</option>
<option>octet</option>
<option>silver</option>
</select>

<select class='seltop' id='selsecond'>
<option>sun</option>
<option>double</option>
<option>sky</option>
<option>river</option>
<option>single</option>
</select>

因此,更改seltop中的任何一个,我只需要显示titles的某些数据(data-a or data-b or data-c)等于a or b

有帮助吗?

p.s。对于管理员-请停止给我这个愚蠢的消息-you post is mostly code...。这是一个纯粹的问题示例,没有bla故事就很清楚。

1 个答案:

答案 0 :(得分:0)

$('.seltop').change(function(){
$('.title').hide();
var a = $('#selfirst').val();
var b = $('#selsecond').val();
$('.title').each(function(){
var data_a = $(this).attr("data_a");
var data_b = $(this).attr("data_b");
var data_c = $(this).attr("data_c");
var data_array = [data_a,data_b,data_c];
if($.inArray(a,data_array) || $.inArray(b,data_array)){
$(this).show();
}
 });
 });