如何將多個下拉值作為 URL 參數傳遞？
[英]How to pass multiple dropdown values as URL parameters?
問題描述
我基本上是在嘗試創建一個帶有 2 個下拉列表的表單，並通過提交按鈕將 select 中的值作為 URL 參數傳遞，
<form action=""> <select id="Select1"> <option value="1">Tshirt</option> <option value="2">Hat</option> <option value="3">Sweater</option> <option value="4">Hoodie</option> </select> <select id="Select2"> <option value="1">Red</option> <option value="2">Yellow</option> <option value="3">Pink</option> </select> <input type="submit" value="Submit"> </form>- 如果未選擇任何下拉菜單，則 url 應為： domain.com
- 如果選擇第一個值，則 url 應為：domain.com/Tshirt
- 否則，如果同時選擇這兩個選項，則 url 應為：domain.com/Tshirt/Red
非常感謝 ！
1 個解決方案
解決方案1
1 已采納 2021-05-19 18:03:49
在提交按鈕上添加click事件偵聽器並獲取所選下拉選項的text屬性。
const submitBtn = document.querySelector("#submitBtn"); submitBtn.addEventListener("click", () => { const select1 = document.querySelector("#Select1"); const select2 = document.querySelector("#Select2"); const val1 = select1.options[select1.selectedIndex].text?? ""; const val2 = select2.options[select2.selectedIndex].text?? ""; const url = `domain.com/${val1}/${val2}`; console.log(url); })
<html> <head></head> <body> <select id="Select1"> <option value="1">Tshirt</option> <option value="2">Hat</option> <option value="3">Sweater</option> <option value="4">Hoodie</option> </select> <select id="Select2"> <option value="1">Red</option> <option value="2">Yellow</option> <option value="3">Pink</option> </select> <input id="submitBtn" type="submit" value="Submit"> </body> </html>
如何在MVC中的JavaScript中傳遞url.action中的多個參數？
[英]How to pass multiple parameters in url.action in JavaScript in MVC?
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.