我想根據用戶在輸入欄位中填寫的內容將用戶重定向到不同的頁面。
例子 ：
- 當他輸入 1 或 2 時，他將被重定向到谷歌
- 當他輸入 3 或 4 時，他將被重定向到 Facebook
- 當他輸入 5 時，他將被重定向到 stackoverflow
否則顯示一條訊息
uj5u.com熱心網友回復：
嘗試使用if else陳述句并window.location.href引導用戶到目標視窗。
function redirect() {
const inputVal = Number(document.getElementById("inputVal").value);
let url = "";
if (inputVal) {
if (inputVal === 1 || inputVal === 2){
url = "https://www.google.com"
} else if (inputVal === 3 || inputVal === 4){
url = "https://www.facebook.com"
} else {
console.log('Redirect Not Defined!!')
}
}
if (url) {
window.location.href = url
}
}
document.getElementById("redirectButton").addEventListener("click", redirect);<input type="number" value=1 id="inputVal" />
<button type="button" id="redirectButton"> Redirect </button>uj5u.com熱心網友回復：
我通常不推薦使用 switch 陳述句，但這里很合適
請注意，在這里，該操作可能會被阻止
document.getElementById("myForm").addEventListener("submit", function(e) {
let loc = "";
switch ( document.getElementById("inputVal").value) {
case 1:
case 2:
loc = "https://www.google.com";
break;
case 3:
case 4:
loc = "https://www.facebook.com"
break;
case 5:
loc = "https://stackoverflow.com";
break;
default:
console.log('Redirect Not Defined!!')
e.preventDefault(); // cancel submit
}
if (loc) this.action = loc;
})<form id="myForm" target="_blank">
<input type="number" value=1 id="inputVal" />
<button type="submit"> Redirect </button>
</form>uj5u.com熱心網友回復：
這是使用物件作為通過索引參考所需位置的地圖的另一個可行建議：
const EL = (sel, EL) => (EL || document).querySelector(sel);
const navigate = () => {
const addr = [
"google.com",
"facebook.com",
"stackoverflow.com",
];
const maps = {
1: 0,
2: 0,
3: 1,
4: 1,
5: 2,
};
const EL_num = EL("#num");
const url = addr[maps[EL_num.value]];
if (url) return location.assign(`https://${url}`);
console.log("Coudn't navigate");
};
EL("#go").addEventListener("click", navigate);<input id="num" type="number" value="1">
<button id="go" type="button">Go</button>比使用iforswitch陳述句要干凈得多。
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/391210.html
標籤：javascript 重定向