此示例使用 HTML + Canvas 實現滑動拼圖驗證碼。Canvas繪制帶隨機缺口的背景，獨立滑塊按鈕監聽滑鼠/觸摸拖拽，實時將滑塊位置映射到Ca...
JS跳轉頁面代碼及例子
Cloud computing and code
2023年05月11日 13:33 715
visitor
JS跳轉頁面是一種很常見的前端交互技術，下面是幾種跳轉頁面的方式：
1. 直接修改 `window.location.href` 屬性，比如：
```javascript window.location.href = "https://sn.qunapu.com"; ```
2. 使用 `window.location.replace` 方法，此方法會替換當前頁面歷史記錄，不會在瀏覽器歷史記錄中留下痕跡：
```javascript
window.location.replace("https://sn.qunapu.com");
```3. 使用 `window.open` 方法在一個新的瀏覽器窗口或標簽頁中打開一個頁面，比如：
```javascript
window.open("https://sn.qunapu.com", "_blank");
````_blank` 參數表示在一個新窗口中打開。
4. 如果你需要在某個時間間隔後自動跳轉到目標頁面，可以使用 `setTimeout` 函數，比如：
```javascript
setTimeout(function() {
window.location.href = "https://sn.qunapu.com";
}, 5000); // 5秒後跳轉到目標頁面
```常見的頁面跳轉一般是在一些條件滿足後觸發跳轉，比如表單提交成功後、某個按鈕點擊後等。以下是一個在表單提交後跳轉頁面的例子：
```javascript
// 獲取表單元素和目標URL
var form = document.getElementById("myForm");
var redirectUrl = "http://www.example.com/success.html";
// 監聽表單提交事件
form.addEventListener("submit", function(event) {
event.preventDefault(); // 阻止默認提交行為
// 進行表單校驗，校驗通過則跳轉到目標頁面
if (validateForm()) {
window.location.href = redirectUrl;
}
});
```
標籤： javascript JS跳轉
相關文章
