代码拉取完成，页面将自动刷新
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>工具箱 | 开发工具箱</title>
<meta name="keyworks" content="工具箱,开发人员工具箱,开发工具箱,程序员工具箱">
<meta name="description" content="提供开发人员常用的工具">
<link href="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet">
<style>
.footer {
line-height: 5rem;
color: #555555
}
#content-password span {
display: list-item;
color: #fff;
background-color: #28a745;
padding: .75em 1.4em;
margin: 5px auto;
font-size: 75%;
font-weight: 700;
line-height: 1;
text-align: center;
white-space: nowrap;
vertical-align: baseline;
border-radius: .25rem;
transition: color .15s;
cursor: pointer;
}
</style>
</head>
<body>
<header style="margin-bottom:30px">
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<a class="navbar-brand" href="/">开发工具箱</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarColor01"
aria-controls="navbarColor01" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarColor01">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="https://www.itzcy.com" target="_blank">辰云博客</a>
</li>
<li class="nav-item active">
<a class="nav-link" href="/about.html">关于工具箱</a>
</li>
</ul>
</div>
</nav>
</header>
<div class="body-content container">
<div class="row">
<div class="col-sm-1"></div>
<form class="col-sm-10">
<div class="form-group row ">
<label class="col-sm-2 col-form-label" for="exampleFormControlSelect2">长度</label>
<div class="col-sm-10">
<div class="custom-control custom-radio custom-control-inline">
<input type="checkbox" checked id="number" name="number" class="custom-control-input">
<label class="custom-control-label" for="number">0~9</label>
</div>
<div class="custom-control custom-radio custom-control-inline">
<input type="checkbox" checked id="small_letter" name="small_letter" class="custom-control-input">
<label class="custom-control-label" for="small_letter">a~z</label>
</div>
<div class="custom-control custom-radio custom-control-inline">
<input type="checkbox" checked id="big_letter" name="big_letter" class="custom-control-input">
<label class="custom-control-label" for="big_letter">A~Z</label>
</div>
<div class="custom-control custom-radio custom-control-inline">
<input type="checkbox" id="character" name="character" class="custom-control-input">
<label class="custom-control-label" for="character">!@#$%^&*()_+-=,./<>?;':"[]{}~`</label>
</div>
</div>
</div>
<div class="form-group row">
<div class="col-sm-6 row">
<label class="col-sm-2 col-form-label" for="length">长度</label>
<div class="col-sm-8">
<select class="form-control" id="length">
<option value="6">6</option>
<option value="8">8</option>
<option value="12">12</option>
<option value="16">16</option>
<option selected value="32">32</option>
<option value="64">64</option>
<option value="128">128</option>
</select>
</div>
</div>
<div class="col-sm-6 row">
<label class="col-sm-2 col-form-label" for="numbers">数量</label>
<div class="col-sm-10">
<select class="form-control" id="numbers">
<option value="1">1</option>
<option value="3">3</option>
<option value="5">5</option>
<option value="10">10</option>
<option value="20">20</option>
<option value="30">30</option>
<option value="50">50</option>
</select>
</div>
</div>
</div>
<div class="form-group row text-center">
<button style="margin: 0 auto;" type="button" class="btn btn-primary" onclick="generate()">生成</button>
</div>
</form>
<div class="col-sm-1"></div>
</div>
<div class="row">
<div class="col-sm-2"></div>
<div class="col-sm-8 text-center" id="content-password">
</div>
<div class="col-sm-2"></div>
</div>
</div>
<div class="col-xl-12 text-center footer">
Copyright © By ToolBox.Itzcy.com. 2019 - <script>
document.write((new Date()).getFullYear())
</script>
</div>
</body>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous">
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"
integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous">
</script>
<script src="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
<script>
const HtmlUtil = {
/*1.用浏览器内部转换器实现html编码（转义）*/
htmlEncode: function (html) {
//1.首先动态创建一个容器标签元素，如DIV
var temp = document.createElement("div");
//2.然后将要转换的字符串设置为这个元素的innerText或者textContent
(temp.textContent != undefined) ? (temp.textContent = html) : (temp.innerText = html);
//3.最后返回这个元素的innerHTML，即得到经过HTML编码转换的字符串了
var output = temp.innerHTML;
temp = null;
return output;
},
/*2.用浏览器内部转换器实现html解码（反转义）*/
htmlDecode: function (text) {
//1.首先动态创建一个容器标签元素，如DIV
var temp = document.createElement("div");
//2.然后将要转换的字符串设置为这个元素的innerHTML(ie，火狐，google都支持)
temp.innerHTML = text;
//3.最后返回这个元素的innerText或者textContent，即得到经过HTML解码的字符串了。
var output = temp.innerText || temp.textContent;
temp = null;
return output;
},
/*3.用正则表达式实现html编码（转义）*/
htmlEncodeByRegExp: function (str) {
var temp = "";
if (str.length == 0) return "";
temp = str.replace(/&/g, "&");
temp = temp.replace(/</g, "<");
temp = temp.replace(/>/g, ">");
temp = temp.replace(/\s/g, " ");
temp = temp.replace(/\'/g, "'");
temp = temp.replace(/\"/g, "\"");
return temp;
},
/*4.用正则表达式实现html解码（反转义）*/
htmlDecodeByRegExp: function (str) {
var temp = "";
if (str.length == 0) return "";
temp = str.replace(/&/g, "&");
temp = temp.replace(/</g, "<");
temp = temp.replace(/>/g, ">");
temp = temp.replace(/ /g, " ");
temp = temp.replace(/'/g, "\'");
temp = temp.replace(/"/g, "\"");
return temp;
},
/*5.用正则表达式实现html编码（转义）（另一种写法）*/
html2Escape: function (sHtml) {
return sHtml.replace(/[<>&"]/g, function (c) {
return {
'<': '<',
'>': '>',
'&': '&',
'"': '"'
} [c];
});
},
/*6.用正则表达式实现html解码（反转义）（另一种写法）*/
escape2Html: function (str) {
var arrEntities = {
'lt': '<',
'gt': '>',
'nbsp': ' ',
'amp': '&',
'quot': '"'
};
return str.replace(/&(lt|gt|nbsp|amp|quot);/ig, function (all, t) {
return arrEntities[t];
});
}
};
function generate() {
let rawHTML = $('#content-password').html()
let dictionaries = [
'0123456789',
'abcdefghijklmnopqrstuvwxyz',
'ABCDEFGHIJKLMNOPQRSTUVWXYZ',
"!@#$%^&*()_+-=,./\<\>?;\':\"[]{}~`"
]
// 计算随机字符串
let randomStr = '';
let number = $('#number:checked').val()
if (number == 'on') {
randomStr += dictionaries[0]
}
let small_letter = $('#small_letter:checked').val()
if (small_letter == 'on') {
randomStr += dictionaries[1]
}
let big_letter = $('#big_letter:checked').val()
if (big_letter == 'on') {
randomStr += dictionaries[2]
}
let character = $('#character:checked').val()
if (character == 'on') {
randomStr += dictionaries[3]
}
let length = parseInt($('#length').val())
let numbers = parseInt($('#numbers').val())
if (numbers <= 0) {
numbers = 1
}
// 打乱随机字符串
var newStrAll = [];
randomStr.split('').forEach((item, index, array) => {
var newIndex = Math.round(Math.random() * newStrAll.length);
newStrAll.splice(newIndex, 0, item);
});
randomStr = newStrAll.join('');
let newHTML = ''
// 生成随机字符串
for (let i = 1; i <= numbers; i++) {
_str = '';
for (var j = 0, index; j < length; j++) {
index = Math.floor(Math.random() * randomStr.length)
_str += randomStr[index];
}
// 写入
newHTML += "<span onclick='copy(this)' data-toggle='tooltip' data-placement='right' title='点击复制'>" + HtmlUtil.htmlEncode(_str) +
"</span>"
}
$('#content-password').html(newHTML + rawHTML)
$('[data-toggle="tooltip"]').tooltip()
}
function copy (ele) {
let transfer = document.createElement('input'); //创建控件
document.body.appendChild(transfer);
transfer.style.cssText = 'position: absolute;right: 45%;top: 80%;'
transfer.value = $(ele).text(); // 这里表示想要复制的内容
transfer.focus();
transfer.select();
if (document.execCommand('copy')) {
document.execCommand('copy');
}
transfer.blur();
document.body.removeChild(transfer); //删除控件
}
</script>
</html>
此处可能存在不合适展示的内容，页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容，可点击提交进行申诉，我们将尽快为您处理。