在 HTML 中調用 JavaScript 函數？
[英]Calling a JavaScript function in HTML?
問題描述
我對 JavaScript 和 HTML 非常陌生，所以請放輕松。 我試圖從我的 HTML 文件中的外部 JavaScript 文件調用一個函數，但我似乎沒有做任何事情允許它工作。
JavaScript 代碼
var trueLength = false; var password = ""; var things = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890!@#$%^&*()-=_+;':,./<>?"; var input = document.getElementById("len"); function generatePassword(passLength){ // Check to see if selected length is at least 8 characters long while (trueLength = false){ if (passLength > 8){ trueLength = true; } else { passLength = prompt("Password Length must be at least 8 characters long! Please try again. "); } } // Select random character from things and add to password until desired length is reached. for(var x = 0; x <= passlength;){ var randomNum=Math.floor(Math.random()*things.length+1); password = password + things.charAt(randomNum); } alert("Your password is: " + password); document.write("<h1>Your Password</h1><p>" + password + "</p>"); }
<!DOCTYPE html> <html> <head> <title>Password Generator</title> </head> <body> <h1 align="center">Password Generator</h1> <script type="text/javascript" src="PassGen.js"></script> <script> var x = prompt("Enter password length: ") function generatePassword(x); </script> </body> </html>
目標是提示用戶輸入密碼長度，然后生成一個隨機密碼，該密碼將提醒用戶並寫在屏幕上。 但是，僅打印屏幕頂部的標題。
（我意識到我可以從 JavaScript 文件中取出函數並正常運行它，但我有點想讓它保持這樣，所以我知道將來如果我再次遇到這種情況該怎么辦。）
3 個解決方案
解決方案1
0 已采納 2019-03-10 03:33:17
以下是HTML文檔中<script>標簽內帶有 Javascript 的代碼。 在 HTML 文件中編寫 javascript 代碼時應該注意的一件事是，將 javascript 代碼包含在 body </body>的結束標記之前。 所以它只有在你的 html 文件加載時才會執行。 但是如果你在起始 ot html 文件中添加你的 javascript 代碼，你的 JS 代碼將在文件加載之前執行。
<!DOCTYPE html> <html> <head> <title>Generate Password</title> </head> <body> <h1 align="center">Password Generated will be displayed here</h1> <p id="password" align="center"></p> <script> var PasswordLength = false; var password = ""; var passwordChoice = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890!@#$%^&*()-=_+;':,./<>?"; var input = prompt("Enter password length: "); var pass = document.getElementById("password"); generatePassword(input); function generatePassword(passLength){ while (PasswordLength == false){ if (passLength >= 8){ for(var x = 0; x < passLength;x++){ var randomNum=Math.floor(Math.random()*passwordChoice.length+1); password = password + passwordChoice.charAt(randomNum); } PasswordLength = true; } else { passLength = prompt("Password Length must be 8 characters long."); } } pass.innerHTML = password;} </script> </body> </html>
如果你想把你的 Javascript 代碼放在一個單獨的文件中，這對大程序很有幫助，那么你需要使用<script>標簽引用該文件，這就是你寫下來的方式。
var PasswordLength = false; var password = ""; var passwordChoice = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890!@#$%^&*()-=_+;':,./<>?"; var input = prompt("Enter password length: "); var pass = document.getElementById("password"); generatePassword(input); function generatePassword(passLength){ while (PasswordLength == false){ if (passLength >= 8){ for(var x = 0; x < passLength;x++){ var randomNum=Math.floor(Math.random()*passwordChoice.length+1); password = password + passwordChoice.charAt(randomNum); } PasswordLength = true; } else { passLength = prompt("Password Length must be 8 characters long."); } } pass.innerHTML = password;}
<!DOCTYPE html> <html> <head> <title>Generate Password</title> <script src=""></script> </head> <body> <h1 align="center">Password Generated will be displayed here</h1> <p id="password" align="center"></p> </body> </html>
解決方案2
0 2019-03-10 04:56:51
在您的代碼中存在以下問題：
1) 更改function generatePassword(x); generatePassword(x.length);
2) 將trueLength = false改為trueLength === false
3) 將for(var x = 0; x <= passlength;){改為for(var x = 0; x < passLength; x++){
passlength => passLength , x<=到x< , 插入x++
4) 改變Math.floor(Math.random()*things.length+1); 到Math.floor(Math.random()*(things.length)+1)
5) 插入passLength = passLength.length; 去else
var trueLength = false; var password = ""; var things = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890!@#$%^&*()-=_+;':,./<>?"; var input = document.getElementById("len"); var x = prompt("Enter password length: ") generatePassword(x.length); function generatePassword(passLength){ // Check to see if selected length is at least 8 characters long while (trueLength == false){ if (passLength > 8){ trueLength = true; } else { passLength = prompt("Password Length must be at least 8 characters long! Please try again. "); passLength = passLength.length; } } // Select random character from things and add to password until desired length is reached. for(var x = 0; x < passLength; x++){ var randomNum=Math.floor(Math.random()*(things.length)+1); password = password + things.charAt(randomNum); } alert("Your password is: " + password); document.write("<h1>Your Password</h1><p>" + password + "</p>"); }
<h1 align="center">Password Generator</h1>
您可以以較低的復雜性使用此代碼：
var trueLength = false, password = "" ; var things = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890!@#$%^&*()-=_+;':,./<>?"; var x = prompt("Enter password length: ") generatePassword(x); var input = document.getElementById("len"); function generatePassword(passLength){ while ( passLength.length < 9 ) passLength = prompt("Password Length must be at least 8 characters long! Please try again. "); for ( var x = 0; x < passLength.length ; x++ ) { var randomNum = Math.floor ( Math.random() * (things.length)+1 ); password = password + things.charAt(randomNum); } alert("Your password is: " + password); document.write("<h1>Your Password</h1><p>" + password + "</p>"); }
<h1 align="center">Password Generator</h1>
解決方案3
-1 2019-03-10 01:16:48
幾樣東西。 為了在 HTML 中顯示某些內容，您需要在 JavaScript 中選擇一個 HTML 元素。 接下來，您在 for 循環中使用了 'passlength' 而不是 'passLength'。 第三，當您編寫function generatepassword ，正如 Lux 所說，它是無效的語法。 最后，您的 for 循環不會去任何地方，因為您沒有第三個表達式。 應該更改為for(var x = 0; x <= passLength;x++)編輯：我忘記的另一件事是trueLength = false應該更改為trueLength == false或trueLength === false 。
綜上所述，這是我的解決方案：
<!DOCTYPE html>
<html>
<head>
<title>Password Generator</title>
</head>
<body>
<h1 align="center">Password Generator</h1>
<p align="center"></p>
<!--script type="text/javascript" src="PassGen.js"></script-->
<script>
var trueLength = false;
var password = "";
var things = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890!@#$%^&*()-=_+;':,./<>?";
//var input = document.getElementById("len");
var ppass = document.querySelector("p");
function generatePassword(passLength){
while (trueLength == false){
if (passLength > 8){
trueLength = true;
} else {
passLength = prompt("Password Length must be at least 8 characters long! Please try again. ");
}
}
for(var x = 0; x <= passLength;x++){
var randomNum=Math.floor(Math.random()*things.length+1);
password = password + things.charAt(randomNum);
}
//alert("Your password is: " + password);
//document.write("<h1>Your Password</h1><p>" + password + "</p>");
ppass.textContent = password;}
var x = prompt("Enter password length: ")
generatePassword(x);
</script>
</body>
</html>
我添加的是一個<p>標簽，用於在生成密碼后顯示密碼。 一旦密碼生成完畢，我就使用textContent來顯示它。 我使用document.querySelector來訪問它。
在HTML中調用JavaScript函數
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.