2014-11-24 99 views
-3

我不明白如何使form函数随css改变。我试图将form移动到页面上的另一个地方作为示例。使用css格式化表格

<!DOCTYPE html> 
<html> 
<head> 


<script type = "text/javascript"> 
var count = 2; 

function validate() { 
    var un = document.myform.username.value; 
    var pw = document.myform.pword.value; 
    var valid = false; 

    var unArray = ["Philip", "George", "Sarah", "Michael"]; 
    var pwArray = ["Password1", "Password2", "Password3", "Password4"]; 

    for (var i=0; i <unArray.length; i++) { 
     if ((un == unArray[i]) && (pw == pwArray[i])) { 
     valid = true; 
      break; 
     } 
    } 

    if (valid) { 
     alert ("Login was successful"); 
     window.location = "http://www.google.com"; 
     return false; 
    } 

    var t = " tries"; 

    if (count == 1) {t = " try"} 

    if (count >= 1) { 
     alert ("Invalid username and/or password. " + 
       "You have " + count + t + " left."); 
     document.myform.username.value = ""; 
     document.myform.pword.value = ""; 
     setTimeout("document.myform.username.focus()", 25); 
     setTimeout("document.myform.username.select()", 25); 
     count --; 
    } 

    else { 
     alert ("Still incorrect! You have no more tries left!"); 
     document.myform.username.value = "No more tries allowed!"; 
     document.myform.pword.value = ""; 
     document.myform.username.disabled = true; 
     document.myform.pword.disabled = true; 
     return false; 
    } 

} 

<!--this--> 
    p.log_on{ 
    position: fixed; 
    top: 34px; 
    right: 29px; 
} 

</script> 




</head> 


<body> 

<!--here--> 
<form name = "myform"> 
    <p class="log_on"> 
    ENTER USER NAME <input type="text" name="username"> 
    ENTER PASSWORD <input type="password" name="pword"> 
    <input type="button" value="Check In" name="Submit" onclick="validate()"> 
    </p> 
</form> 
<!--to here--> 

</body> 


</html> 
+1

你的 “代码” 显示显著缺乏了解。我建议你回到更简单的例子,并建立你的知识。 – 2014-11-24 23:57:17

+0

你应该回应那些试图帮助你的人。这就是这个网站的工作原理。 – 2014-11-26 01:12:11

回答

0

只要改变你的HTML标签周围像这样

... 

document.myform.pword.disabled = true; 
     return false; 
    } 

} 
</script> 
<style> 
p.log_on{ 
    position: fixed; 
    top: 34px; 
    right: 29px; 
} 
</style> 
</head> 
<body> 
... 
0

你混合CSS和Javascript。 CSS应该从脚本标签中分离出来并放置在一个样式标签中。使用Javacript作为登录系统不是特别强大。


<head> 
    <script type = "text/javascript"> 
    var count = 2; 

    function validate() { 
     var un = document.myform.username.value; 
     var pw = document.myform.pword.value; 
     var valid = false; 

     var unArray = ["Philip", "George", "Sarah", "Michael"]; 
     var pwArray = ["Password1", "Password2", "Password3", "Password4"]; 

     for (var i=0; i <unArray.length; i++) { 
     if ((un == unArray[i]) && (pw == pwArray[i])) { 
     valid = true; 
     break; 
     } 
     } 

    if (valid) { 
     alert ("Login was successful"); 
     window.location = "http://www.google.com"; 
     return false; 
    } 

    var t = " tries"; 

    if (count == 1) {t = " try"} 

    if (count >= 1) { 
     alert ("Invalid username and/or password. " + 
      "You have " + count + t + " left."); 
     document.myform.username.value = ""; 
     document.myform.pword.value = ""; 
     setTimeout("document.myform.username.focus()", 25); 
     setTimeout("document.myform.username.select()", 25); 
     count --; 
    } 

    else { 
     alert ("Still incorrect! You have no more tries left!"); 
     document.myform.username.value = "No more tries allowed!"; 
     document.myform.pword.value = ""; 
     document.myform.username.disabled = true; 
     document.myform.pword.disabled = true; 
     return false; 
    } 

} 

</script> 

<style> 

    p.log_on{ 
    position: fixed; 
    top: 34px; 
    right: 29px; 
} 

</style>