根据数据属性搜索元素。 我有以下代码,想知道如果带空格的数据属性值
如何实现<div class="data" data-value="auto"> abcd </div>
<div class="data" data-value="simple tab,block"> acd </div>
<div class="data" data-value="auto"> abd </div>
<div class="data" data-value="block"> abcde </div>
<div class="null-data"> type the correct value </div>
<input class="search-text" name="keyword" type="text" id="search-keyword" placeholder="search">
在键入输入值事件时,我基本上想找出属于特定数据值的所有项目?
$('#search-keyword').on( "keyup", function() {
$('.null-data').hide();
if($(this).val()) {
var input = $(this).val().toLowerCase();
$(".data").hide();
$(".data[data-value*="+ input +"]").show();
if(!$('.data:visible').get(0)){
$('.null-data').show();
}
}else{
$('.null-data').show();
}
});
我正在获取基于数据属性值的 html 元素,但如果数据属性值有空格,则不会显示 html 元素。
最佳答案
在构建选择器时,您需要将输入值用引号括起来,就像其中的内容元字符一样:
$(".data[data-value*='"+ input +"']").show();
//-------------------^-----------^
if(!$('.data:visible').get(0)){
$('.null-data').show();
}
关于javascript - 使用数据属性值搜索 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27834820/