Javascript 键入时根据“过滤图像”；alt"；标签

我需要根据“alt”属性中包含的文本，仅显示包含在输入字段中键入的文本的图像

我需要一些特殊字符的过滤器，键入文本也不区分大小写。例如，当键入“coração”一词时，带有“coracao”的图像必须显示在结果中，并且忽略大小写（“coraçÃo”必须返回带有“coracao”的图像，或者“示例”必须返回“示例”）。记住，alt属性不会包含任何特殊字符

我的代码是（我不知道javascript，只是在互联网上找到的）

---

谢谢。

这是您在a中的工作代码，我将很快向您发送特殊字符的过滤器

<img src="http://via.placeholder.com/160x80" alt="16">
<img src="http://via.placeholder.com/150x80" alt="15">
<img src="http://via.placeholder.com/140x80" alt="14">
<img src="http://via.placeholder.com/130x80" alt="13">

<input type="text" id="filter">

$("#filter").keyup(function() {
  var val = $.trim(this.value);
  if (val === "")
    $('img').show();
  else {
    $('img').hide();
    $('img[alt*=' + val + "]").show();
  }
});

$（“#过滤器”）.keyup（函数（）{
var val=$.trim（此.value）；
如果（val==“”）
$（'img'）.show（）；
否则{
$（'img'）.hide（）；
$（'img[alt*='+val+“]）；
}
});

---

更新：新的特殊字符

所以您想要的是删除特殊字符，但保留相关字母

<img src="http://via.placeholder.com/160x80" alt="16">
<img src="http://via.placeholder.com/150x80" alt="15">
<img src="http://via.placeholder.com/140x80" alt="14">
<img src="http://via.placeholder.com/130x80" alt="13">

<input type="text" id="filter">

$("#filter").keyup(function() {
  var val = $.trim(this.value);
  if (val === "")
    $('img').show();
  else {
    $('img').hide();
    $('img[alt*=' + val + "]").show();
  }
});

您可以使用string方法，然后删除不需要的字符：

function removeDiacritics（str）{
返回str和str.normalize（'NFD'）。替换（/[\u0300-\u036f]/g'）；
}
removeDiacritics（‘Coração’）；//科拉索

更新

要使其在代码中工作，请执行以下操作：

$（函数（）{
功能性除颤器（str）{
返回str和str.normalize（'NFD'）。替换（/[\u0300-\u036f]/g'）；
}
函数规格化（str）{
return（removeDiacritics（str）| |“”）.trim（）.toLowerCase（）；
}
$（“#myinput”）.keyup（函数（）{
var val=标准化（此.value）；
如果（val==“”）
$（'img'）.show（）；
否则{
$（'img'）.hide（）；
//假设alt已经标准化
$（'img[alt*='+val+“]）；
}
});
});
这似乎是你想要的。请注意，这只适用于ES6（这意味着更新的浏览器——可能不亚于Internet Explorer 11）。按照答案的建议，使用
String.Prototype.Normalize（）
去除特殊字符


$（'#myinput'）.keyup（函数（）{
设val=$.trim（此.value）；
val=val.normalize（'NFD'）。替换（/[\u0300-\u036f]/g'）；
如果（val==''）{
$（'img'）.show（）；
}否则{
$（'img'）.hide（）；
$（'img'）。每个（（i，img）=>{
让imgAlt=img.alt.normalize（'NFD'）。替换（/[\u0300-\u036f]/g'）；
if（（imgAlt.toLowerCase（））.indexOf（val.toLowerCase（））>-1）{
$（img.show（）；
}
});
}
});

这正是我的代码。我需要一些方法来忽略大小写和特殊字符。谢谢你。你好，我把这个放在哪里了<代码>$（“#过滤器”）.keyup（函数（）{var val=$.trim（this.value）；if（val==”“）$（'img'）.show（）；else{$（'img'）.hide（）；$（'img[alt*='+val+“]）.show（）}）
@RodrigoCaetano代码
应在HTML中，而代码
$（“#过滤器”）…
应在javascript（js）文件中（或HTML中的
脚本
标记中）。如果您使用js文件，只需将其包含在html中（
）。@RodrigoCaetano使用js代码更新了Ansare。