How to redirect to another html file in the same directory which is located inside a folder using js?
Question
here's the index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<form id="form-marksheet">
<div class="name">
<p>Name</p>
<input type="text">
</div>
<div class="roll-no">
<p>Roll No.</p>
<input type="text">
</div>
<div class="subject-english">
<p>Marks for English</p>
<input type="text">
</div>
<div class="subject-science">
<p>Marks for Science</p>
<input type="text">
</div>
<div class="subject-math">
<p>Marks for math</p>
<input type="text">
</div>
<div class="btn-trigger-update">
<button onclick="updateScreen()">Get your marksheet</button>
</div>
</form>
<script src="script.js"></script>
</body>
</html>
and the js file
// Global variables
const student_name = document.getElementById("name")
const roll_no = document.getElementById("roll-no")
const english = document.getElementById("subject-english")
const science = document.getElementById("subject-science")
const math = document.getElementById("subject-math")
// Functions
function updateScreen() {
}
so when updateScreen is called, basically when the get your marksheet is pressed, i want to redirect to another file called ms.html which is in the same directory as the index.html. And yes, this all things are in a folder called input-page . I have tried location.href = "ms.html" , location.assign(ms.html) . Both of them don't work. Can anyone show me how to redirect to another html file using js?
and here's style.css too
/* Font imports */
@import url('https://fonts.googleapis.com/css2?family=Anek+Latin:wght@600&family=Kanit:wght@300&family=Open+Sans&family=PT+Sans&family=Poppins:wght@300;500&family=Roboto+Mono:wght@700&family=Smooch+Sans:wght@300;900&family=Source+Sans+Pro&display=swap');
/* Styling */
* {
margin: 0;
overflow: hidden;
font-family: 'Poppins', sans-serif;
}
html, body { height: 100%; }
body {text-align: center;}
form {display: inline-block;}
this isn't required, but I gave anyways.
1 answers
solution1
0 2022-07-11 17:32:40
You should be able to do it using:
window.location.href = "ms.html";
Here is a reference to a similar article with more details: Jumping to a new HTML page with JavaScript
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.