Javascript登录重定向不工作

Javascript login redirect not working

本文关键字：工作 重定向 登录 Javascript      更新时间：2023-09-26

所以，在我的网页设计课上，我的老师要求我教这个班简单的javascript，我想做一个简单的网站，我的老师和我都可以用它来做这件事。我想要的东西(我认为简单的),有一个登录框,当你登录,如果你使用我的登录或我的老师登录它,它会创建按钮或重定向到另一个页面的按钮,但出于某种原因,如果else语句我使用的登录(因为它只有两个实例中,这将是真正的不想工作。

编辑:我还在学习Javascript，只了解它的一些非常基本的部分。(这就是我所需要的)我所要做的就是使按钮出现，这样我就可以使用它们来调用创建信息的函数，这些信息是在单击按钮时写出来的。例如，要在给出正确的登录信息时创建按钮，然后当出现的按钮显示时，您可以单击第一个按钮，然后出现关于脚本标记的段落。

没有太多的麻烦与密码和名称检查功能的工作，当我使他们两个警报，第一个是eeyup，如果它是正确的，如果给出的信息是错误的，他们两个都工作。只有当我尝试使用文档时才会这样。写我遇到的问题

*目前，它所做的是按钮在屏幕上闪烁一秒钟，然后消失，登录框/屏幕重新出现。*

我使用的登录功能是:

        <script type="text/javascript">
function validator(){
    var name = document.KageForm.User.value;
    var password= document.KageForm.pass.value;
    if(password=="mypassword" && name=="myusername"|| password=="myteacherspassword" &&name=="myteachersname" ){
  document.write(showbuttons());
} else {
    document.write("This is not meant for you to see.");
}}
</script>

显示按钮的函数showbuttons如下所示:

function showbuttons(){
    document.write("<div><form><input type='"button'" value='"Starting Your Script'" onclick='"FirstThingsFirst()'"/><br/><input type='"button'" value='"Learn about document.write'" onclick='"writing()'" /><br/><input  type='"button'" value='"Variables'"onclick='"settingVariables()'" /><br/><input type='"button'" value='"Using Functions'" onclick='"usingFunctions()'" /><br/><input type='"button'" value='"If Statements'" onclick='"usingIfStatements()'" /><br/><input type='"button'" value='"Else Statements'" onclick='"usingElseStatements()'" /><br/><input type='"button'" value='"Return to Login'" onclick='"homepage()'" /></form></div>")
    document.body.style.backgroundImage="url('https://fc04.deviantart.net/fs70/f/2013/029/6/8/smoke_by_kage_kaldaka-d5t50d9.jpg')";
document.getElementById('thisshouldbewhite').style.color="white";
document.getElementById('thisshouldbewhite').style.width="400px";
document.getElementById('thisshouldbewhite').style.fontFamily="helvetica";
}

整个页面的总代码是这样的:(如果按钮拉出的文本中有任何不准确的地方，请指出来)

    <!doctype html>
    <html>
    <head>
            <style type="text/css"> 
      body {background-image:url(https://fc04.deviantart.net/fs70/f/2013/029/6/8/smoke_by_kage_kaldaka-d5t50d9.jpg)}
body{
    font-family:helvetica;
    color:darkviolet;
}
    h2 {color:darkviolet;}
    #tag1 {width:480px;}
#wrapper { width:960px;margin:0 auto; }
}
    div {
    margin: 5px;
      border: 5px solid darkviolet;
width:50%;
}
  img {
    width:20.00%;
    height:20.00%;
   }
ul li a {
    margin: 10px;
    padding: 2px;
    background: #f2a7c6;
    float: left;
    border: 2px ;
}
a:link {text-decoration:none
    color:darkviolet;}
    h3 {
        font-family:helvetica;
    color:darkviolet
    }
   #white {
    color:white;
   }
    </style>
    <script type="text/javascript">

/*<input type='"button'" value='"Starting Your Script'" onclick='"FirstThingsFirst()'"/><br/><input type='"button'" value='"Learn about document.write'" onclick='"writing()'" /><br/><input  type='"button'" value='"variables'"onclick='"settingVariables()'" /><br/>input type='"button'" value='"Using Functions'" onclick='"usingFunctions()'" /><br/>input type='"button'" value='"If Statements'" onclick='"usingIfStatements()'" /><br/>input type='"button'" value='"Else Statements'" onclick='"usingElseStatements()'" />*/
function FirstThingsFirst() {
var mytext = "<div id='"thisshouldbewhite'"> To start writing Javascript into your page, you must first make use of the script tag. The tag is 'script' type='"text/javascript'"  with the closing tag simply being /script. you can use a Javascript either in your heading of your page, after the style tag, or anywhere in your body. Personally, I prefer to put all my script, or at least my functions,  in the head of my page.</div> <input type='"button'" value='"Return to Home'" onclick='"homepage()'" />"
    document.write(mytext);
document.body.style.backgroundImage="url('https://fc04.deviantart.net/fs70/f/2013/029/6/8/smoke_by_kage_kaldaka-d5t50d9.jpg')";
document.getElementById('thisshouldbewhite').style.color="white";
document.getElementById('thisshouldbewhite').style.width="400px";
document.getElementById('thisshouldbewhite').style.fontFamily="helvetica";
}

function writing() 
{    
var mytext = "<div id='"thisshouldbewhite'">To write something out on your screen, you use the command ''document.write()'. To get what you want to appear, put qutation marks around it in the paranthesis. So to write out '"bacon'", you would put: document.write('"bacon'") in your script. Document.write() is used for many things, mainly displaying information based on input data given to the page by the user that fits into variables defined by the creator of the page. For example, document.write(variableX()) would print out anything that has been put in for variableX.</div><input type='"button'" value='"Return to Home'" onclick='"homepage()'" />"
    document.write(mytext);
document.body.style.backgroundImage="url('https://fc04.deviantart.net/fs70/f/2013/029/6/8/smoke_by_kage_kaldaka-d5t50d9.jpg')";
document.getElementById('thisshouldbewhite').style.color="white";
document.getElementById('thisshouldbewhite').style.width="400px";
document.getElementById('thisshouldbewhite').style.fontFamily="helvetica";
}
function settingVariables(){
    document.write("<div id='"thisshouldbewhite'">to create a variable, youtype in ''var'' followed by a space, then the name of the variable, an = then what the variable is equal to. So, if you had food on your mind and wanted your variable to be ''bacon'' your variable would be: var food='"bacon'"</div><input type='"button'" value='"Return to Home'" onclick='"homepage()'" />")
    document.body.style.backgroundImage="url('https://fc04.deviantart.net/fs70/f/2013/029/6/8/smoke_by_kage_kaldaka-d5t50d9.jpg')";
document.getElementById('thisshouldbewhite').style.color="white";
document.getElementById('thisshouldbewhite').style.width="400px";
document.getElementById('thisshouldbewhite').style.fontFamily="helvetica";
}
function usingFunctions(){
  document.write("<div id='"thisshouldbewhite'">Functions are used to use commands only when triggered, or to do multiple things at once. for example, open up a website and type in the following code: <br/> <i>function troll(){<br/>document.write('"gotcha!'");<br/>document.write(gotcha());<br/> function gotcha(){<br/>document.write('" hahahaha!'");<br/>document.write(troll())</i>;<br/> What this will do is that the first function will call the second function, and then when the second function is called it will call the first function.Since neither are being called at the moment, create a button in your html as usual, but in the starting tag, add the property'"onClick'". Name your button something like, 'start trolling' or something like that. So, your code for your input should look something like <i><-input type='"button'" value='"Starting Your Script'" onclick='"FirstThingsFirst()'"/></i> <br/> obviously minus the dash at the start of the tag.</br><input type='"button'" value='"Commence Trolling'" onclick='"troll()'"/></div><input type='"button'" value='"Return to Home'" onclick='"homepage()'" />");
  document.body.style.backgroundImage="url('https://fc04.deviantart.net/fs70/f/2013/029/6/8/smoke_by_kage_kaldaka-d5t50d9.jpg')";
document.getElementById('thisshouldbewhite').style.color="white";
document.getElementById('thisshouldbewhite').style.width="400px";
document.getElementById('thisshouldbewhite').style.fontFamily="helvetica";
}
function usingIfStatements(){
  document.write("<div id='"thisshouldbewhite'">If statements are used to create scenarios such as login screens, since that is the use that will be most familiar to most of us. An If statement goes inside the function tag, so when in use the statement looks like this:<br/>function login(){<br/>if(conditions for if statement){commands for if statement to follow}}<br/> Here is an example of a functional function using an IF Statement:<br/>function login(){<br/>var name='"your name'";<br/>if(name=='"your name'"){document.write('"You are indeed yourself'")}}<br/>This would print out the words in the command following the If statement, since the statement is true, since the variable, '"name'" is equal to '"your name'"</div><input type='"button'" value='"Return to Home'" onclick='"homepage()'" />");
  document.body.style.backgroundImage="url('https://fc04.deviantart.net/fs70/f/2013/029/6/8/smoke_by_kage_kaldaka-d5t50d9.jpg')";
document.getElementById('thisshouldbewhite').style.color="white";
document.getElementById('thisshouldbewhite').style.width="400px";
document.getElementById('thisshouldbewhite').style.fontFamily="helvetica";
}
function usingElseStatements(){
    document.write("<div id='"thisshouldbewhite'">So, we know how to make an If statement, now we are going to use Else statements. This would be like on a login screen, if you type in inaccurate information and it gives you an error message<i><br/>function login(){<br/>if(conditions for if statement){commands for if statement to follow}else(commands for script to follow if your If statement is not true)}</i><br/> Here is an example of a functional function using an IF Statement:<i><br/>function login(){<br/>var name='"your name'";<br/>if(name=='"your name'"){document.write('"You are indeed yourself'")else{document.write('"you are not yourself when you're hungry.'")}}}<br/></i></div>")
    document.body.style.backgroundImage="url('https://fc04.deviantart.net/fs70/f/2013/029/6/8/smoke_by_kage_kaldaka-d5t50d9.jpg')";
document.getElementById('thisshouldbewhite').style.color="white";
document.getElementById('thisshouldbewhite').style.width="400px";
document.getElementById('thisshouldbewhite').style.fontFamily="helvetica";
}

function troll(){
document.write("gotcha!");
document.write(gotcha());
}
function gotcha(){
document.write(" hahahaha!");
document.write(troll())
}
function homepage() 
{
    window.location.href = "file:///C:/Users/Admin/Documents/Websites/TEst.html";
}
function gotoButtons() 
{
    window.location.href = "file:///C:/Users/Admin/Documents/Websites/Buttons.html";
}

function showbuttons(){
    document.write("<div><form><input type='"button'" value='"Starting Your Script'" onclick='"FirstThingsFirst()'"/><br/><input type='"button'" value='"Learn about document.write'" onclick='"writing()'" /><br/><input  type='"button'" value='"Variables'"onclick='"settingVariables()'" /><br/><input type='"button'" value='"Using Functions'" onclick='"usingFunctions()'" /><br/><input type='"button'" value='"If Statements'" onclick='"usingIfStatements()'" /><br/><input type='"button'" value='"Else Statements'" onclick='"usingElseStatements()'" /><br/><input type='"button'" value='"Return to Login'" onclick='"homepage()'" /></form></div>")
    document.body.style.backgroundImage="url('https://fc04.deviantart.net/fs70/f/2013/029/6/8/smoke_by_kage_kaldaka-d5t50d9.jpg')";
document.getElementById('thisshouldbewhite').style.color="white";
document.getElementById('thisshouldbewhite').style.width="400px";
document.getElementById('thisshouldbewhite').style.fontFamily="helvetica";
}
        </script>
        </head>
        <body>
           <script type="text/javascript">
      function validator(){
        var name = document.KageForm.User.value;
        var password= document.KageForm.pass.value;
        if(password=="mypassword" && name=="myusername"|| password=="myteacherspassword" &&name=="myteachersname" ){
      document.write(showbuttons());
    } else {
        document.write("This is not meant for you to see.");
    }}
        </script>
        <form name="KageForm">
            Username:<input type="text" name="User">
        <br/>
            Password: <input type="password" name="pass">
        <br/>
        <input type="image" src="https://a.deviantart.net/avatars/k/a/kage-kaldaka.png?6" 
         value="Submit" onclick="validator()" />
        <br/>
        <input type="button" value="Starting Your Script" onclick="FirstThingsFirst()"/>
        <br/>
        <input type="button" value="Learn about document.write" onclick="writing()" />
        <br/>
        <input  type="button" value="Variables" 
       onclick="settingVariables()" />
         <br/>
       <input type="button" value="Using Functions" onclick="usingFunctions()" />
       <br/>
       <input type="button" value="If Statements" onclick="usingIfStatements()" />
       <br/>
       <input type="button" value="Else Statements" onclick="usingElseStatements()" />
       <br/>
       <input type="button" value="" onclick="" />
       <br/>
       <input type="button" value="" onclick="()" />
       <br/>
       <input type="button" value="" onclick="()" />
       <br/>
       <input type="button" value="" onclick="()" />

        </form>

    </body>

    </html>

您的代码中有几个问题:

  1. 将validator()函数中的document.write(showbuttons());更改为showbuttons();。因为showbuttons()不返回字符串，而是自己写HTML;

    2. 改变

  2. <input type="image" src="https://a.deviantart.net/avatars/k/a/kage-kaldaka.png?6" value="Submit" onclick="validator()" />

    <img src="https://a.deviantart.net/avatars/k/a/kage-kaldaka.png?6" value="Submit" onclick="validator()" /> .

    由于<input type="image" ... />触发浏览器提交表单并重新加载页面

工作示例可以在这里看到http://jsbin.com/ayovom/2/edit.

你必须把每个条件放在单独的括号里

  (((password =="mypassword") && (name=="myusername")) || ((password=="myteacherspassword") && (name=="myteachersname")) )

所以我们用圆括号…在每个&符号作为自己的分组…这两个条件前面的或作为一个分组和另一个相同的

所以你总共有六个组。

还有，如果你打算使用这个网站，我曾经问过一个"家庭作业"或学校相关的问题，并被钉在十字架上，因为这显然是不允许的。

相关文章：