Question

这是我的代码：

<!DOCTYPE html>
<html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<style>
    #wrap { 
        width: 1000px; 
        margin: 0 auto; 
    }
    .out_box {
        float: left;
        margin: 20px 20px 20px 20px;
        border: 1px solid black;
        padding: 0 5px 0 5px;
        min-width: 280px;
    }
    input {
        margin: 10px;
    }
    input {
        vertical-align: -3px;
    }
    h1 {
        font-size: 400%;
        color: black;
        margin: 0 0 10px 0;
    text-align: center;
    }
    h2 {
        font-size: 100%;
        color: black;
        margin: 5px 0 5px 0;
    text-align: center;
    }
    h3 {
        font-size: 95%;
        color: black;
        margin: 5px 0 5px 0;
    }
    h4 {
        font-size: 200%;
        color: black;
        margin: 5px 0 5px 0;
    text-align: center;
    }
    p, form, button {
        font-size: 80%;
        color: #252525;
    }
    .small_text {
        font-size: 70%;
        color: #737373;
    }
    body {
        background-color: lightblue;
    }
</style>
</head>
<body>
    <div id=wrap>
        <h1>Login</h1>
        <form class="form1" action=”index3.htm”>
            <div class="formtitle">
                Enter the password to proceed
            </div>

            <div class="input nobottomborder">
                <div class="inputtext">
                    Password:
                </div>

                <div class="inputcontent">
                    <input type="password" id="password" /><br />
                </div>
            </div>

            <div class="buttons">
                <input class="orangebutton" type="submit" value="Login" onclick="if (document.getElementById('password').value == ’smurfsmurf’) location.href='index3.htm'; else alert('Wrong Password!');" />
            </div>
        </form>
    </div>
</body>
</html>

当我进行重定向时，它与地址相同：file:///Volumes/ETHERNET/"index3.htm"。

该目录中有一个名为index.htm的文件，这是我尝试访问的文件。如何修复添加“”符号？

最好的问候

奥斯卡

Answer 1

您的表单操作中的引号类型错误。改变这一行：

<form class="form1" action=”index3.htm”>

为此：

<form class="form1" action="index3.htm">

此外，因为你的javascript是一个按钮，根据标准，提交表单，你的JavaScript将不会像你期望的那样做出反应。您应该在代码中添加return false;，并在if语句周围添加花括号，并删除弯曲的单引号：

<input class="orangebutton" type="submit" value="Login" onclick="if (document.getElementById('password').value == 'smurfsmurf') {location.href='index3.htm';} else {alert('Wrong Password!');}return false;" />

虽然，就个人而言，我建议不要使用内联JavaScripting。相反，请使用EventTarget.addEventListener：https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener向下滚动到示例，了解其工作原理。

<强>解释

直接引号不是技术上 HTML属性值所必需的（我强烈推荐使用它们）。您没有使用直引号（"），而是使用弯曲引号（”），这对于包装HTML属性值无效。因此，浏览器会将您表单上的action解释为”index3.htm”而不是index3.htm。

当您点击submit按钮时，默认操作是将表单提交给它action属性。因此，您的浏览器会重定向到/”index3.htm”。在重定向到表单的操作值之前，您的JavaScript没有时间启动并更改浏览器的位置。

让我知道这个解释是否会产生。

location.href将“”添加到文件名

1 个答案: