我是 Stack Overflow 的新手，這是我的第一個問題。
拜托，我希望這個問題不是很愚蠢并浪費您的時間，因為我在編碼/編程方面的知識不是很高（幾年前我做了一個資料庫課程，我學到的關于編碼的大部分內容是創建一個交換在歐元/美元和時鐘之間，哈哈）
因此，我一直在嘗試使用 HTML 創建某種演示文稿，您可以在其中看到幾年（2020 年、2019 年等）的結果，我們希望在結果下方立即顯示相應年份，例如，如果我選擇2019 年然后下面顯示 2019 年的結果（收益、利潤、虧損和不同的數字）
這里有一些基本的 html 代碼示例：
<p>選擇年份結果：</p>
<選擇id="年"名稱="年">
< option hidden="" disabled="disabled" selected="selected" value="none">選擇一個選項
<option value="Year 2021">2021 年
<option value="Year 2020">2020 年
<option value="Year 2019">2019 年
<option value="Year 2018">2018 年
</選擇>
我一直在尋找一些關于 HTML 的教程并進行了一些測驗，我已經知道如何將結果鏈接到另一個頁面，例如，如果我選擇 2019 年然后打開一個新頁面并顯示 2019 年的結果，但是我想知道如何在選擇選單下方的同一頁面中顯示結果。我的意思是結果隨著選擇的“選項值”而變化。
那么有沒有人知道如何做到這一點，或者有一些例子向我展示，以便我可以處理它？
非常感謝大家的時間，如果問題很愚蠢，我很抱歉。
uj5u.com熱心網友回復：
您可以將onchange添加到選擇中，因此當值更改時，會執行一個 javascript 函式來更新頁面上的其余 HTML。
這是一個沒有任何格式的簡單示例
const twenty = [3, 42, 100]
const twentyone = [4, 24, 1]
const updateInfo = () => {
const select = document.getElementById('selector')
const div = document.getElementById('output')
let output
if (select.value === '2020') {
output = twenty
}
else if (select.value === '2021'){
output = twentyone
}
div.innerHTML = '' output
}<select id='selector' onchange='updateInfo()'>
<option value=2020>2020</option>
<option value=2021>2021</option>
</select>
<div id='output'></div>uj5u.com熱心網友回復：
為此，您需要一種允許您與瀏覽器互動的編程語言，例如 Javascript。這是非常必要的，因為它允許您在同一頁面上動態插入、洗掉和更新元素。
檔案 index.html
<html>
<head>
<script type="text/javascript" src="script.js"></script>
</head>
<body>
<p>Select the year results:</p>
<select id="Year" name="Year" onchange="showResults(this.options[this.selectedIndex].value)">
<option hidden="" disabled="disabled" selected="selected" value="none">Select an Option</option>
<option value="2021">Year 2021</option>
<option value="2020">Year 2020</option>
<option value="2019">Year 2019</option>
<option value="2018">Year 2018</option>
</select >
<div id="result"></div>
</body>
</html>
檔案 script.js
function showResults(selectedObject) {
//Inside this function the variable "selectedObject" contains the value of the selected option.
//From now on, Do what you want with the selected value.
//For example: Get data from a database and display it in a table, etc.
document.getElementById("result").innerHTML = "You selected: " selectedObject;
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/367639.html
上一篇：通過JSON.parse傳遞我的有效負載將我的日期物件值更改為不對齊
下一篇：影像未加載HTML