1
當我單擊生成按鈕時，當前密碼生成器正在創建一個密碼。是否可以使用相同的功能創建不同密碼的列表？應根據表格底部的密碼數量選項確定將創建的密碼數量。從密碼生成器創建密碼列表
var CHARACTER_TABLE = [
[true, "Numbers", ""],
[true, "Lowercase", "abcdefghijklmnopqrstuvwxyz"],
[false, "Upercase", "ABCDEFGHIJKLMNOPQRSTUVWXYZ"],
];
var passwordContent = document.createTextNode("");
var statisticsContent = document.createTextNode("\u00A0");
function init() {
var items = document.createDocumentFragment();
CHARACTER_TABLE.forEach(function(key, x) {
var spanItem = document.createElement("span");
var inputItem = document.createElement("input");
inputItem.type = "checkbox";
inputItem.checked = key[0];
inputItem.id = "charset-" + x;
spanItem.appendChild(inputItem);
var labelItem = document.createElement("label");
labelItem.htmlFor = inputItem.id;
labelItem.appendChild(document.createTextNode(" " + key[1] + " "));
var detailsItem = document.createElement("em");
detailsItem.appendChild(document.createTextNode("(" + key[2] + ")"));
labelItem.appendChild(detailsItem);
spanItem.appendChild(labelItem);
items.appendChild(spanItem);
items.appendChild(document.createElement("br"));
});
var itemsWrapper = document.getElementById("charset-options");
itemsWrapper.insertBefore(items, itemsWrapper.firstChild);
}
init();
function generatePassword() {
var charsetTxt = "";
CHARACTER_TABLE.forEach(function(key, x) {
if (document.getElementById("charset-" + x).checked) {
charsetTxt += key[2];
}
});
var charsetArray = [];
for (var i = 0; charsetTxt.length > i; i++) {
var character = charsetTxt.charCodeAt(i);
var placeholder = null;
if (0xD800 > character || character >= 0xE000) {
placeholder = charsetTxt.charAt(i);
} else if (character >= 0xD800 ? 0xDC00 > character : false) {
if (charsetTxt.length > i + 1) {
var next = charsetTxt.charCodeAt(i + 1);
if (next >= 0xDC00 ? 0xE000 > next : false) {
placeholder = charsetTxt(i, 2);
i++;
}
}
} else if (next >= 0xDC00 ? 0xE000 > next : false) {
i++;
} else {
throw "Assertion error";
}
if (placeholder != null ? charsetArray.indexOf(placeholder) == -1 : false) {
charsetArray.push(placeholder);
}
}
var thePassword = "";
var theStatistics = "";
if (charsetArray.length == 0) {
alert("Error: Character set is empty");
} else {
var theLength;
if (document.getElementById("select-length").checked) {
theLength = parseInt(document.getElementById("length").value, 10);
} else {
throw "Assertion error";
}
if (0 > theLength) {
alert("Negative password length");
} else if (theLength > 10000) {
slert("Password length too large");
} else {
for (var i = 0; theLength > i; i++) {
thePassword += charsetArray[randomInt(charsetArray.length)];
theStatistics = "Length = " + theLength + " chars";
}
}
}
passwordContent.data = thePassword;
statisticsContent.data = theStatistics;
document.getElementById("generatedPassword").appendChild(passwordContent);
document.getElementById("generatedStatistics").appendChild(statisticsContent);
}
var theAmount = document.getElementById("amount").value;
$('#generator').on('click', function() {
for(var i = 0; i < theAmount; i++) {
generatePassword();
}
});
function randomInt(n) {
var x = randomIntMathRandom(n);
x = (x + randomIntBrowserCrypto(n)) % n;
return x;
}
function randomIntMathRandom(n) {
var x = Math.floor(Math.random() * n);
if (0 > x || x >= n) {
throw "Arithmetic exception";
}
return x;
}
var cryptoObject = null;
function randomIntBrowserCrypto(n) {
if (cryptoObject == null) {
return 0;
}
var x = new Uint32Array(1);
do cryptoObject.getRandomValues(x);
while (x[0] - x[0] % n > 4294967296 - n);
return x[0] % n;
}#generator {
display: inline-block;
color: #444;
border: 1px solid #CCC;
background: #DDD;
box-shadow: 0 0 5px -1px rgba(0, 0, 0, 0.2);
cursor: pointer;
vertical-align: middle;
max-width: 100px;
padding: 5px;
text-align: center;
}
#generator:active {
color: red;
box-shadow: 0 0 5px -1px rgba(0, 0, 0, 0.6);
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
<p id="charset-options">
</p>
<div class="section">
<div>
<table>
<tbody>
<tr>
<td>
<input type="hidden" name="type" id="select-length" checked="checked">
<label for="select-length">Length: </label>
</td>
<td>
<input type="number" min="0" value="10" step="1" id="length" style="width:4em"> characters</td>
</tr>
<tr>
<td>
<input type="hidden" name="amount" id="select-amount">
<label for="select-amount">Number of Passwords: </label>
</td>
<td>
<input type="number" min="0" value="1" step="1" id="amount" style="width:4em">
</td>
</tr>
</tbody>
</table>
</div>
</div>
<br>
<div id="generator" style="padding:0.5em 0.5em">Generate</div>:
<span id="generatedPassword"></span>
<p id="generatedStatistics"></p>
</form>這裏是我的嘗試失敗瞭解決問題的循環：
var theAmount = document.getElementById("amount").value;
$('#generator').on('click', function() {
for(var i = 0; i < theAmount; i++) {
generatePassword();
}
});
您可以在瀏覽器中使用開發人員工具來調試問題。 以谷歌瀏覽器爲例，您可以查看該視頻 https://www.youtube.com/watch?v=htZAU7FM7GI –