0
フィルタリストが空の場合、背景を1つの色に変更する方法はありますか?ただし、リストに何かがある場合は、同じままにしておきます。何かを濾過し、まだ表示されている場合、背景が同じに留まるように、しかし、フィルタリストは、背景を変更するために何かを見つけることができないとき、私は方法を探していリストが空のときだけ背景を変更してください
$('#myInput').keyup(function(e) {
\t if(e.keyCode == 13){
\t \t mySearch();
\t \t Check();
\t }
});
\t \t
function myInput() {
\t var empt = document.getElementById("myInput").value;
\t if (empt == "")
\t {
\t \t mySearch();
\t \t return false;
\t }
\t else
\t {
\t \t return true;
\t }
}
\t \t
function mySearch() {
\t var input, filter, ul, li, a, i;
\t input = document.getElementById("myInput");
\t filter = input.value.toUpperCase();
\t ul = document.getElementById("myUl");
\t li = ul.getElementsByTagName("a");
\t for (tag = 0; tag < li.length; tag++) {
\t \t a = li[tag].getElementsByTagName("p")[0];
\t \t if (a.innerHTML.toUpperCase().indexOf(filter) > -1) {
\t \t \t \t \t li[tag].style.display = "";
\t \t } else {
\t \t \t li[tag].style.display = "none";
\t \t }
\t }
}
#listentry {
\t width: 280px;
\t height: 150px;
\t color: #999;
\t float: left;
\t margin: 5px;
\t background-color: #1d1d1d;
\t box-shadow: 5px 5px 5px #0d0d0d;
\t border-bottom-left-radius: 6px;
\t border-top-left-radius: 6px;
} \t
#listentry:hover {
\t background-color: #222;
\t color: #999;
\t cursor: pointer;
}
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<input type="text" id="myInput" onkeyup="myInput()" placeholder="Search...">
<div id="myUl">
<a href="#indexModal" id="entry">
\t <article id="listentry">
\t \t <img src="Images/index.png" id="img1" style="float: left; width: 105px; height: 150px;">
\t \t <article id="desc">
\t \t \t <center>
\t \t \t \t <p id="title">A Certain Magical Index</p>
\t \t \t \t <p id="rating">TV-MA</p>
\t \t \t </center>
\t \t </article>
\t </article>
</a>
<a href="#index2Modal">
\t <article id="listentry">
\t <img src="Images/index2.png" id="img1" style="float: left; width: 105px; height: 150px;">
\t <article id="desc">
\t \t \t <center>
\t \t \t \t <p id="title4">A Certain Magical Index: The Miracle of Endymion</p>
\t \t \t \t <p id="rating">TV-MA</p>
\t \t \t </center>
\t \t </article>
\t </article>
</a>
<a href="#railgunModal">
\t <article id="listentry">
\t <img src="Images/railgun.png" id="img1" style="float: left; width: 104px; height: 150px;">
\t \t <article id="desc">
\t \t \t <center>
\t \t \t \t <p id="title">A Certain Scientific Railgun</p>
\t \t \t \t <p id="rating">TV-14</p>
\t \t \t </center>
\t \t </article>
\t </article>
</a>
</div>
</body>
</html>
。 ありがとう!