[英]Calling a javascript function in html
我正在使用javascript和html。 我有一个称为登录的javascript函数,我想用HTML调用此函数。 我看到了一些直接在HTML中包含javascript函数的代码。 我不想这样做,因为代码很长。 这是HTML:
<input class="form-control form-stacked" name="username" placeholder="Username" type="text" required="true" id="username">
<input class="form-control form-stacked last" name="password" placeholder="Password" type="password" required="true" id="password">
<script>
window.onload = login()
</script>
<input class="btn btn-beats btn-block btn-stacked" value="Tune in" type="submit">
Javascript函数是:
function login(){
var userName = document.getElementById("username").value;
var password = document.getElementById("password").value;
console.log(userName);
console.log(password);
var data = {
userName : userName,
password : password
};
console.log(data);
doJSONRequest("POST", "/login", {}, data, function(location){
document.location = location.location;
});
}
我包括一个window.onload,因为我想在页面启动时调用该函数。 控制台(显然)对我说“未定义登录”,当然,这是有原因的。 但是我不想将所有代码都放到HTML中(也是因为多了30行)。 你能帮我吗? 谢谢大家 :)
将JavaScript放在另一个js文件(例如filename.js)中,然后将其加载到标头中。
<script src="path to the file"></script>
另外,您还必须将window.onload = login()
更改为window.onload = login
window.onload
需要功能的引用。 当您使用window.onload = login()
时, login()
函数的返回值设置为不正确的引用。 函数名称login
是参考。
我认为您想要的是在用户单击按钮时运行您的登录代码。 您可以这样进行:
<form>
<input class="form-control form-stacked" name="username" placeholder="Username" type="text" required="true" id="username">
<input class="form-control form-stacked last" name="password" placeholder="Password" type="password" required="true" id="password">
<input class="btn btn-beats btn-block btn-stacked" value="Tune in" onclick="login()">
</form>
<script src="login.js></script>
login.js:
function login(){
var userName = document.getElementById("username").value;
var password = document.getElementById("password").value;
console.log(userName);
console.log(password);
var data = {
userName : userName,
password : password
};
console.log(data);
doJSONRequest("POST", "/login", {}, data, function(location){
...
});
解
为了与其他用户保持正确,这是我的解决方案:
<form action="login.html" method="POST" class="form-signup">
<input class="form-control form-stacked" name="firstname" placeholder="Firstname" type="text" required="true">
<input class="form-control form-stacked" name="lastname" placeholder="Lastname" type="text" required="true">
<input class="form-control form-stacked" name="username" placeholder="Username" type="text" required="true" id="username" onkeyup="login()">
<input class="form-control form-stacked" name="email" placeholder="email" type="email" required="true">
<input class="form-control form-stacked" name="password" id = "password" placeholder="Password" type="password" required="true" onkeyup="login()">
<input class="form-control form-stacked last" name="repeatPassword" id="repeat" placeholder="Repeat password" type="password" onkeyup="enable()" required="true">
<input class="btn btn-beats btn-block btn-stacked" value="Sign up" id = "btnPlaceOrder" type="submit">
</form>
当用户要存储值时,我只添加了“登录”功能
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.