[英]Calling a javascript function in html
I'm working on javascript and html. 我正在使用javascript和html。 I have a javascript function, called login, and I want to call this function in HTML.
我有一个称为登录的javascript函数,我想用HTML调用此函数。 I saw some codes that includes the javascript function directly in the HTML.
我看到了一些直接在HTML中包含javascript函数的代码。 I don't want to do it because the code is very long.
我不想这样做,因为代码很长。 Here is the HTML:
这是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">
And the Javascript function is: 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;
});
}
I included a window.onload because I want to call the function when the page started. 我包括一个window.onload,因为我想在页面启动时调用该函数。 The console (obliviously) says to me that "login in not defined" and, of course, it has reason.
控制台(显然)对我说“未定义登录”,当然,这是有原因的。 But I don't want to put all the code into the HTML (also because there are like 30 lines more).
但是我不想将所有代码都放到HTML中(也是因为多了30行)。 Can you help me please?
你能帮我吗? Thanks to everyone :)
谢谢大家 :)
Put the javascript in another js file(eg: filename.js) and load it load it in the header.. 将JavaScript放在另一个js文件(例如filename.js)中,然后将其加载到标头中。
<script src="path to the file"></script>
Also you have to change window.onload = login()
to window.onload = login
另外,您还必须将
window.onload = login()
更改为window.onload = login
window.onload
expects a reference of a function. window.onload
需要功能的引用。 When you use window.onload = login()
the return value of the login()
function is set as the reference which is not correct. 当您使用
window.onload = login()
时, login()
函数的返回值设置为不正确的引用。 The function name login
is the reference.. 函数名称
login
是参考。
I think that what you want is to run your login code when the user clicks on the button. 我认为您想要的是在用户单击按钮时运行您的登录代码。 You can do that this way:
您可以这样进行:
<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: 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){
...
});
SOLUTION 解
Just to be correct with the other users here is my solution: 为了与其他用户保持正确,这是我的解决方案:
<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>
I just add the function "login" when the user wants to store the values 当用户要存储值时,我只添加了“登录”功能
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.