我為我的健身網站工作,我制作了一個博客頁面,現在有很多文章可用,我制作了一個加載更多的按鈕來顯示更多的文章和腳本工作正常,現在接下來的事情是我想在頁面頂部放置一個搜索欄,這樣用戶就可以看到他在搜索欄中寫的文章。我做了一個劇本我不知道問題出在哪里
代碼如下所示
現在html代碼是:
<input type="text" id="inputarticle" onkeyup="myfunction()" size="162" placeholder="Enter the article name">
<div class="grid-container">
<div class="grid-hidden1">
<img class="blog-cl-1-image">
<h2 > <a href="fat.html">Importance of Fat for human Body</a> </h2>
<h4>August 21 2019</h4>
<p>When you eat fat in your diet the most important thing that matters are the type of fat you eat. New research shows that healthy fats are important for optimal health.</p>
</div>
<div class="grid-hidden1">
<img class="blog-cl-2-image">
<h2> <a href="zinc.html">Role of Zinc in Human Body</a> </h2>
<h4>August 21 2019</h4>
<p>Zinc is an essential nutrient that plays an important role in the human body. As your body doesn’t produce zinc so it is essential to take it from food or supplements.</p>
</div>
</div>
現在javascript是:-
function myfunction() {
// Declare variables
var input, filter, ul, h2, a,i, txtValue;
input = document.getElementById("inputarticle");
filter = input.value.toUpperCase();
ul = document.getElementsByClassName("grid-container");
h2 = ul.getElementsByTagName("h2");
// Loop through all list items, and hide those who don't match the search query
for (i = 0; i < li.length; i++) {
a = h2[i].getElementsByTagName("a")[0];
txtValue = a.textContent || a.innerText;
if (txtValue.toUpperCase().indexOf(filter) > -1) {
h2[i].style.display = "";
} else {
h2[i].style.display = "none";
}
}
}
不知道問題出在哪里?請幫幫忙
嘗試更改for-loop if語句中的以下行,看看是否可行:
h2[i].style.display = "";
到
h2[i].style.display = "block";
沒有完整的HTML文件和邏輯,很難確切知道發生了什么。此外,不確定這是否是一個打字錯誤,但您的HTML缺少第一個示例項目的開頭。
<div class="grid-hidden1">
<img class="blog-cl-1-image">
<h2 > <a href="fat.html">Importance of Fat for human Body</a> </h2>
<h4>August 21 2019</h4>
<p>When you eat fat in your diet the most important thing that matters are the type of fat you eat. New research shows that healthy fats are important for optimal health.</p>
**</div>** <-- MISSING OPENING DIV
...
希望這有所幫助!
上一篇c# json中的數據
下一篇在CSS網格中居中