在我的頁面https://vidsk.dk/上,我有一個包含 9 個選項的下拉選單的表單。我也有九個相應的帶有 a-tags 的按鈕。我希望用戶能夠按下按鈕,從而在表單下拉選單中選擇相應的值。
我的選擇:
<select>
<option value="Dansk">Dansk</option>
<option value="Engelsk">Engelsk</option>
<option value="Tysk">Tysk</option>
<option value="Fysik">Fysik</option>
<option value="Matematik">Matematik</option>
<option value="Samfundsfag">Samfundsfag</option>
<option value="Latin">Latin</option>
<option value="Spansk">Spansk</option>
<option value="Kinesisk">Kinesisk</option>
</select>
a標簽示例:
<a>Englsk</a>
目的:用戶看到 9 個大按鈕并想點擊他的選擇,這將改變表單并推動用戶填寫表單的其余部分并發送。
頁面背景:頁面是在 WordPress 中制作的,出于某種原因,它使用 a-tag 而不是 button-tag 作為按鈕。我寧愿不必更換標簽。
我的背景:我相當精通 HTML 和 CSS,過去對 PHP 也還好,但那是 10 年前的事了。100% 自學。如果存在僅使用 PHP 的解決方案,即沒有 Java 或類似的解決方案,我會更喜歡這樣。我對此進行了廣泛的搜索(2 小時以上),但找不到解決方案。
uj5u.com熱心網友回復:
PHP 是一種服務器端語言,因此您無法在不重新呈現整個頁面的情況下更改所選值,這并不理想。
您需要使用 JavaScript。
您可以通過修改“值”屬性來更改下拉串列的值。
function setSelect(val){
document.getElementById("myselect").value = val;
}
<select id="myselect">
<option value="Dansk">Dansk</option>
<option value="Engelsk">Engelsk</option>
<option value="Tysk">Tysk</option>
<option value="Fysik">Fysik</option>
<option value="Matematik">Matematik</option>
<option value="Samfundsfag">Samfundsfag</option>
<option value="Latin">Latin</option>
<option value="Spansk">Spansk</option>
<option value="Kinesisk">Kinesisk</option>
</select>
<div>
<button onclick="setSelect('Latin')">Latin</button>
</div>
uj5u.com熱心網友回復:
你可以試試這個:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function selectItem(itemValue)
{
document.querySelector('#mySelect').value = itemValue;
}
</script>
</head>
<body>
<select id="mySelect">
<option value="Dansk">Dansk</option>
<option value="Engelsk">Engelsk</option>
<option value="Tysk">Tysk</option>
<option value="Fysik">Fysik</option>
<option value="Matematik">Matematik</option>
<option value="Samfundsfag">Samfundsfag</option>
<option value="Latin">Latin</option>
<option value="Spansk">Spansk</option>
<option value="Kinesisk">Kinesisk</option>
</select>
<a onclick="selectItem(this.innerHTML)">Engelsk</a>
<a onclick="selectItem(this.innerHTML)">Tysk</a>
<a onclick="selectItem(this.innerHTML)">Fysik</a>
<a onclick="selectItem(this.innerHTML)">Matematik</a>
<a onclick="selectItem(this.innerHTML)">Samfundsfag</a>
<a onclick="selectItem(this.innerHTML)">Latin</a>
<a onclick="selectItem(this.innerHTML)">Spansk</a>
<a onclick="selectItem(this.innerHTML)">Kinesisk</a>
<a onclick="selectItem(this.innerHTML)">Dansk</a>
</body>
</html>
轉載請註明出處,本文鏈接:https://www.uj5u.com/caozuo/433884.html
