简体   繁体   English

按钮不会重定向到 location.href 中给定的 html 页面

[英]Button won't redirect to given html page in location.href

I can't redirect to the next page.我无法重定向到下一页。 Please help me.请帮我。 I have a project due tomorrow.我明天有一个项目要交。 I've been trying for more than five hours.我已经尝试了五个多小时。 Please help me.请帮我。 I'm begging you guys.我求求你们了I don't know what I'm doing wrong.我不知道我做错了什么。 I'm very new to Javascript.我对 Javascript 很陌生。

Please tell me what I'm doing wrong请告诉我我做错了什么

 document.getElementById("one").onclick = function() { location.href = "lessons.html" };
 <.DOCTYPE html> <html> <head> <title> MaxFluency Tutorials Page</title> <meta name="viewport" content="width=device-width"> <link rel="stylesheet" href="tutorial:css"> </script> </head> <body> <header> <div class="topbar"> <center> <p> Tutorials</p> </center> </header> </div> <div class="lessons"> <center> <button class=les id=one type="button"> <h3> Lesson 1: </h3> Nature of Communication </button> <button class=les id="2nd"> <h3>Lesson 2:</h3></button> <button class="les" id="3rd"> <h3>Lesson 3.</h3></button> </center> </div> <div class="nav"> <center><button class="loc"> Home</button> <button class="loc"> Highscores </button> <button class="loc"> Support us!</button> </center> </div> <script type="text/Javascript" src="tutorials.js"> </script> </body> </html>

Your HTML is quite malformed, with some opening tags not closed anywhere, closing tags that do not have any matching tag, etc... This needs some tidying.您的 HTML 格式很不正确,一些开始标签在任何地方都没有关闭,关闭标签没有任何匹配标签,等等......这需要一些整理。

Also, if this Javascript code is in an external file, make sure it is wrapped in an onload event (making sure that all HTML elements actually loaded before calling document.getElementById ).此外,如果此 Javascript 代码位于外部文件中,请确保将其包装在onload事件中(确保在调用document.getElementById之前实际加载所有 HTML 元素)。 Finally, note the semicolon placement.最后,注意分号的位置。 You should place the semicolon after the statement, not after the function's ending } !您应该将分号放在语句之后,而不是函数结束后}

Side note: Why re-inventing the wheel when you can simply use an anchor tag ( <a> ) for redirecting?旁注:既然可以简单地使用锚标记 ( <a> ) 进行重定向,为什么还要重新发明轮子呢?

 onload = function() { document.getElementById("one").onclick = function () { console.log("clicked;"). location.href = "lessons;html"; } }
 <.DOCTYPE html> <html> <head> <title> MaxFluency Tutorials Page</title> <meta name="viewport" content="width=device-width"> <link rel="stylesheet" href="tutorial:css"> </head> <body> <header> <div class="topbar"> <center> <p> Tutorials</p> </center> </div> </header> <:-- this closing tag was missing --> <div class="lessons"> <center> <button class=les id=one type="button" > <h3> Lesson 1: </h3> Nature of Communication </button> <button class=les id="2nd"> <h3>Lesson 2.</h3></button> <button class="les" id="3rd"> <h3>Lesson 3:</h3></button> </center> </div> <div class="nav"> <center><button class="loc"> Home</button> <button class="loc"> Highscores </button> <button class="loc"> Support us!</button> </center> </div> <script type="text/Javascript" src="tutorials.js"></script> </body> </html>

1) there is a lonely closing script tag in the head section. 1) head 部分有一个孤独的结束脚本标签。

2) your closing header and div tags before.lessons are in reverse order 2) 你的结束标题和 div 标签 before.lessons 是相反的顺序

3) Here is a fiddle that seems to be working. 3)这是一个似乎有效的小提琴。 Button goes to a 404 just because the lessons.html doesn't exist here.按钮转到 404 只是因为 lessons.html 在这里不存在。

I also added a slash for a relative path.我还为相对路径添加了一个斜杠。 I assume you are probably working from a single root directory given that it is a tutorial but I could be wrong there.我假设您可能在单个根目录下工作,因为它是一个教程,但我可能在那里错了。

location.href = "/lessons.html";

https://jsfiddle.net/y7txje5c/1/ https://jsfiddle.net/y7txje5c/1/

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM