Commit 54520644 by tzn

Merge branch 'master' of coding.yundingshuyuan.com:hyl/Lingyun_Winter_Vacation_project

parents 1b47e872 215bfdbf
[0226/174208.726:ERROR:registration_protocol_win.cc(102)] CreateFile: 系统找不到指定的文件。 (0x2)
[0226/175308.209:ERROR:registration_protocol_win.cc(102)] CreateFile: 系统找不到指定的文件。 (0x2)
[0226/175308.419:ERROR:registration_protocol_win.cc(102)] CreateFile: 系统找不到指定的文件。 (0x2)
File added
/* Logo 字体 */
/* Logo 字体 */
@font-face {
font-family: "iconfont logo";
src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834');
src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'),
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'),
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'),
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg');
}
.logo {
font-family: "iconfont logo";
font-size: 160px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
/* tabs */
.nav-tabs {
position: relative;
}
.nav-tabs .nav-more {
position: absolute;
right: 0;
bottom: 0;
height: 42px;
line-height: 42px;
color: #666;
}
#tabs {
border-bottom: 1px solid #eee;
}
#tabs li {
cursor: pointer;
width: 100px;
height: 40px;
line-height: 40px;
text-align: center;
font-size: 16px;
border-bottom: 2px solid transparent;
position: relative;
z-index: 1;
margin-bottom: -1px;
color: #666;
}
#tabs .active {
border-bottom-color: #f00;
color: #222;
}
.tab-container .content {
display: none;
}
/* 页面布局 */
.main {
padding: 30px 100px;
width: 960px;
margin: 0 auto;
}
.main .logo {
color: #333;
text-align: left;
margin-bottom: 30px;
line-height: 1;
height: 110px;
margin-top: -50px;
overflow: hidden;
*zoom: 1;
}
.main .logo a {
font-size: 160px;
color: #333;
}
.helps {
margin-top: 40px;
}
.helps pre {
padding: 20px;
margin: 10px 0;
border: solid 1px #e7e1cd;
background-color: #fffdef;
overflow: auto;
}
.icon_lists {
width: 100% !important;
overflow: hidden;
*zoom: 1;
}
.icon_lists li {
width: 100px;
margin-bottom: 10px;
margin-right: 20px;
text-align: center;
list-style: none !important;
cursor: default;
}
.icon_lists li .code-name {
line-height: 1.2;
}
.icon_lists .icon {
display: block;
height: 100px;
line-height: 100px;
font-size: 42px;
margin: 10px auto;
color: #333;
-webkit-transition: font-size 0.25s linear, width 0.25s linear;
-moz-transition: font-size 0.25s linear, width 0.25s linear;
transition: font-size 0.25s linear, width 0.25s linear;
}
.icon_lists .icon:hover {
font-size: 100px;
}
.icon_lists .svg-icon {
/* 通过设置 font-size 来改变图标大小 */
width: 1em;
/* 图标和文字相邻时,垂直对齐 */
vertical-align: -0.15em;
/* 通过设置 color 来改变 SVG 的颜色/fill */
fill: currentColor;
/* path 和 stroke 溢出 viewBox 部分在 IE 下会显示
normalize.css 中也包含这行 */
overflow: hidden;
}
.icon_lists li .name,
.icon_lists li .code-name {
color: #666;
}
/* markdown 样式 */
.markdown {
color: #666;
font-size: 14px;
line-height: 1.8;
}
.highlight {
line-height: 1.5;
}
.markdown img {
vertical-align: middle;
max-width: 100%;
}
.markdown h1 {
color: #404040;
font-weight: 500;
line-height: 40px;
margin-bottom: 24px;
}
.markdown h2,
.markdown h3,
.markdown h4,
.markdown h5,
.markdown h6 {
color: #404040;
margin: 1.6em 0 0.6em 0;
font-weight: 500;
clear: both;
}
.markdown h1 {
font-size: 28px;
}
.markdown h2 {
font-size: 22px;
}
.markdown h3 {
font-size: 16px;
}
.markdown h4 {
font-size: 14px;
}
.markdown h5 {
font-size: 12px;
}
.markdown h6 {
font-size: 12px;
}
.markdown hr {
height: 1px;
border: 0;
background: #e9e9e9;
margin: 16px 0;
clear: both;
}
.markdown p {
margin: 1em 0;
}
.markdown>p,
.markdown>blockquote,
.markdown>.highlight,
.markdown>ol,
.markdown>ul {
width: 80%;
}
.markdown ul>li {
list-style: circle;
}
.markdown>ul li,
.markdown blockquote ul>li {
margin-left: 20px;
padding-left: 4px;
}
.markdown>ul li p,
.markdown>ol li p {
margin: 0.6em 0;
}
.markdown ol>li {
list-style: decimal;
}
.markdown>ol li,
.markdown blockquote ol>li {
margin-left: 20px;
padding-left: 4px;
}
.markdown code {
margin: 0 3px;
padding: 0 5px;
background: #eee;
border-radius: 3px;
}
.markdown strong,
.markdown b {
font-weight: 600;
}
.markdown>table {
border-collapse: collapse;
border-spacing: 0px;
empty-cells: show;
border: 1px solid #e9e9e9;
width: 95%;
margin-bottom: 24px;
}
.markdown>table th {
white-space: nowrap;
color: #333;
font-weight: 600;
}
.markdown>table th,
.markdown>table td {
border: 1px solid #e9e9e9;
padding: 8px 16px;
text-align: left;
}
.markdown>table th {
background: #F7F7F7;
}
.markdown blockquote {
font-size: 90%;
color: #999;
border-left: 4px solid #e9e9e9;
padding-left: 0.8em;
margin: 1em 0;
}
.markdown blockquote p {
margin: 0;
}
.markdown .anchor {
opacity: 0;
transition: opacity 0.3s ease;
margin-left: 8px;
}
.markdown .waiting {
color: #ccc;
}
.markdown h1:hover .anchor,
.markdown h2:hover .anchor,
.markdown h3:hover .anchor,
.markdown h4:hover .anchor,
.markdown h5:hover .anchor,
.markdown h6:hover .anchor {
opacity: 1;
display: inline-block;
}
.markdown>br,
.markdown>p>br {
clear: both;
}
.hljs {
display: block;
background: white;
padding: 0.5em;
color: #333333;
overflow-x: auto;
}
.hljs-comment,
.hljs-meta {
color: #969896;
}
.hljs-string,
.hljs-variable,
.hljs-template-variable,
.hljs-strong,
.hljs-emphasis,
.hljs-quote {
color: #df5000;
}
.hljs-keyword,
.hljs-selector-tag,
.hljs-type {
color: #a71d5d;
}
.hljs-literal,
.hljs-symbol,
.hljs-bullet,
.hljs-attribute {
color: #0086b3;
}
.hljs-section,
.hljs-name {
color: #63a35c;
}
.hljs-tag {
color: #333333;
}
.hljs-title,
.hljs-attr,
.hljs-selector-id,
.hljs-selector-class,
.hljs-selector-attr,
.hljs-selector-pseudo {
color: #795da3;
}
.hljs-addition {
color: #55a532;
background-color: #eaffea;
}
.hljs-deletion {
color: #bd2c00;
background-color: #ffecec;
}
.hljs-link {
text-decoration: underline;
}
/* 代码高亮 */
/* PrismJS 1.15.0
https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */
/**
* prism.js default theme for JavaScript, CSS and HTML
* Based on dabblet (http://dabblet.com)
* @author Lea Verou
*/
code[class*="language-"],
pre[class*="language-"] {
color: black;
background: none;
text-shadow: 0 1px white;
font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
text-align: left;
white-space: pre;
word-spacing: normal;
word-break: normal;
word-wrap: normal;
line-height: 1.5;
-moz-tab-size: 4;
-o-tab-size: 4;
tab-size: 4;
-webkit-hyphens: none;
-moz-hyphens: none;
-ms-hyphens: none;
hyphens: none;
}
pre[class*="language-"]::-moz-selection,
pre[class*="language-"] ::-moz-selection,
code[class*="language-"]::-moz-selection,
code[class*="language-"] ::-moz-selection {
text-shadow: none;
background: #b3d4fc;
}
pre[class*="language-"]::selection,
pre[class*="language-"] ::selection,
code[class*="language-"]::selection,
code[class*="language-"] ::selection {
text-shadow: none;
background: #b3d4fc;
}
@media print {
code[class*="language-"],
pre[class*="language-"] {
text-shadow: none;
}
}
/* Code blocks */
pre[class*="language-"] {
padding: 1em;
margin: .5em 0;
overflow: auto;
}
:not(pre)>code[class*="language-"],
pre[class*="language-"] {
background: #f5f2f0;
}
/* Inline code */
:not(pre)>code[class*="language-"] {
padding: .1em;
border-radius: .3em;
white-space: normal;
}
.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
color: slategray;
}
.token.punctuation {
color: #999;
}
.namespace {
opacity: .7;
}
.token.property,
.token.tag,
.token.boolean,
.token.number,
.token.constant,
.token.symbol,
.token.deleted {
color: #905;
}
.token.selector,
.token.attr-name,
.token.string,
.token.char,
.token.builtin,
.token.inserted {
color: #690;
}
.token.operator,
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string {
color: #9a6e3a;
background: hsla(0, 0%, 100%, .5);
}
.token.atrule,
.token.attr-value,
.token.keyword {
color: #07a;
}
.token.function,
.token.class-name {
color: #DD4A68;
}
.token.regex,
.token.important,
.token.variable {
color: #e90;
}
.token.important,
.token.bold {
font-weight: bold;
}
.token.italic {
font-style: italic;
}
.token.entity {
cursor: help;
}
<!DOCTYPE html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>iconfont Demo</title>
<link rel="shortcut icon" href="//img.alicdn.com/imgextra/i2/O1CN01ZyAlrn1MwaMhqz36G_!!6000000001499-73-tps-64-64.ico" type="image/x-icon"/>
<link rel="icon" type="image/svg+xml" href="//img.alicdn.com/imgextra/i4/O1CN01EYTRnJ297D6vehehJ_!!6000000008020-55-tps-64-64.svg"/>
<link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css">
<link rel="stylesheet" href="demo.css">
<link rel="stylesheet" href="iconfont.css">
<script src="iconfont.js"></script>
<!-- jQuery -->
<script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script>
<!-- 代码高亮 -->
<script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script>
<style>
.main .logo {
margin-top: 0;
height: auto;
}
.main .logo a {
display: flex;
align-items: center;
}
.main .logo .sub-title {
margin-left: 0.5em;
font-size: 22px;
color: #fff;
background: linear-gradient(-45deg, #3967FF, #B500FE);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
</style>
</head>
<body>
<div class="main">
<h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank">
<img width="200" src="https://img.alicdn.com/imgextra/i3/O1CN01Mn65HV1FfSEzR6DKv_!!6000000000514-55-tps-228-59.svg">
</a></h1>
<div class="nav-tabs">
<ul id="tabs" class="dib-box">
<li class="dib active"><span>Unicode</span></li>
<li class="dib"><span>Font class</span></li>
<li class="dib"><span>Symbol</span></li>
</ul>
</div>
<div class="tab-container">
<div class="content unicode" style="display: block;">
<ul class="icon_lists dib-box">
<li class="dib">
<span class="icon iconfont">&#xe655;</span>
<div class="name">头像</div>
<div class="code-name">&amp;#xe655;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe660;</span>
<div class="name">密码</div>
<div class="code-name">&amp;#xe660;</div>
</li>
</ul>
<div class="article markdown">
<h2 id="unicode-">Unicode 引用</h2>
<hr>
<p>Unicode 是字体在网页端最原始的应用方式,特点是:</p>
<ul>
<li>支持按字体的方式去动态调整图标大小,颜色等等。</li>
<li>默认情况下不支持多色,直接添加多色图标会自动去色。</li>
</ul>
<blockquote>
<p>注意:新版 iconfont 支持两种方式引用多色图标:SVG symbol 引用方式和彩色字体图标模式。(使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。)</p>
</blockquote>
<p>Unicode 使用步骤如下:</p>
<h3 id="-font-face">第一步:拷贝项目下面生成的 <code>@font-face</code></h3>
<pre><code class="language-css"
>@font-face {
font-family: 'iconfont';
src: url('iconfont.ttf?t=1645538265051') format('truetype');
}
</code></pre>
<h3 id="-iconfont-">第二步:定义使用 iconfont 的样式</h3>
<pre><code class="language-css"
>.iconfont {
font-family: "iconfont" !important;
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
</code></pre>
<h3 id="-">第三步:挑选相应图标并获取字体编码,应用于页面</h3>
<pre>
<code class="language-html"
>&lt;span class="iconfont"&gt;&amp;#x33;&lt;/span&gt;
</code></pre>
<blockquote>
<p>"iconfont" 是你项目下的 font-family。可以通过编辑项目查看,默认是 "iconfont"。</p>
</blockquote>
</div>
</div>
<div class="content font-class">
<ul class="icon_lists dib-box">
<li class="dib">
<span class="icon iconfont icon-touxiang"></span>
<div class="name">
头像
</div>
<div class="code-name">.icon-touxiang
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-mima"></span>
<div class="name">
密码
</div>
<div class="code-name">.icon-mima
</div>
</li>
</ul>
<div class="article markdown">
<h2 id="font-class-">font-class 引用</h2>
<hr>
<p>font-class 是 Unicode 使用方式的一种变种,主要是解决 Unicode 书写不直观,语意不明确的问题。</p>
<p>与 Unicode 使用方式相比,具有如下特点:</p>
<ul>
<li>相比于 Unicode 语意明确,书写更直观。可以很容易分辨这个 icon 是什么。</li>
<li>因为使用 class 来定义图标,所以当要替换图标时,只需要修改 class 里面的 Unicode 引用。</li>
</ul>
<p>使用步骤如下:</p>
<h3 id="-fontclass-">第一步:引入项目下面生成的 fontclass 代码:</h3>
<pre><code class="language-html">&lt;link rel="stylesheet" href="./iconfont.css"&gt;
</code></pre>
<h3 id="-">第二步:挑选相应图标并获取类名,应用于页面:</h3>
<pre><code class="language-html">&lt;span class="iconfont icon-xxx"&gt;&lt;/span&gt;
</code></pre>
<blockquote>
<p>"
iconfont" 是你项目下的 font-family。可以通过编辑项目查看,默认是 "iconfont"。</p>
</blockquote>
</div>
</div>
<div class="content symbol">
<ul class="icon_lists dib-box">
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-touxiang"></use>
</svg>
<div class="name">头像</div>
<div class="code-name">#icon-touxiang</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-mima"></use>
</svg>
<div class="name">密码</div>
<div class="code-name">#icon-mima</div>
</li>
</ul>
<div class="article markdown">
<h2 id="symbol-">Symbol 引用</h2>
<hr>
<p>这是一种全新的使用方式,应该说这才是未来的主流,也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
这种用法其实是做了一个 SVG 的集合,与另外两种相比具有如下特点:</p>
<ul>
<li>支持多色图标了,不再受单色限制。</li>
<li>通过一些技巧,支持像字体那样,通过 <code>font-size</code>, <code>color</code> 来调整样式。</li>
<li>兼容性较差,支持 IE9+,及现代浏览器。</li>
<li>浏览器渲染 SVG 的性能一般,还不如 png。</li>
</ul>
<p>使用步骤如下:</p>
<h3 id="-symbol-">第一步:引入项目下面生成的 symbol 代码:</h3>
<pre><code class="language-html">&lt;script src="./iconfont.js"&gt;&lt;/script&gt;
</code></pre>
<h3 id="-css-">第二步:加入通用 CSS 代码(引入一次就行):</h3>
<pre><code class="language-html">&lt;style&gt;
.icon {
width: 1em;
height: 1em;
vertical-align: -0.15em;
fill: currentColor;
overflow: hidden;
}
&lt;/style&gt;
</code></pre>
<h3 id="-">第三步:挑选相应图标并获取类名,应用于页面:</h3>
<pre><code class="language-html">&lt;svg class="icon" aria-hidden="true"&gt;
&lt;use xlink:href="#icon-xxx"&gt;&lt;/use&gt;
&lt;/svg&gt;
</code></pre>
</div>
</div>
</div>
</div>
<script>
$(document).ready(function () {
$('.tab-container .content:first').show()
$('#tabs li').click(function (e) {
var tabContent = $('.tab-container .content')
var index = $(this).index()
if ($(this).hasClass('active')) {
return
} else {
$('#tabs li').removeClass('active')
$(this).addClass('active')
tabContent.hide().eq(index).fadeIn()
}
})
})
</script>
</body>
</html>
@font-face {
@font-face {
font-family: "iconfont"; /* Project id */
src: url('iconfont.ttf?t=1645538265051') format('truetype');
}
.iconfont {
font-family: "iconfont" !important;
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-touxiang:before {
content: "\e655";
}
.icon-mima:before {
content: "\e660";
}
!function(e){var t,n,c,o,i,l='<svg><symbol id="icon-touxiang" viewBox="0 0 1024 1024"><path d="M309.52 494.12c-1.94 0-3.47 0.28-4.67 0.76 1.63-0.49 3.37-0.76 5.16-0.76L309.52 494.12zM845.13 707.52c0.05-0.99 0.18-1.96 0.39-2.9C845.29 705.05 845.17 705.97 845.13 707.52zM880.86 313.29c0.01-0.04 0.01-0.09 0.01-0.13l0-0.46C880.87 312.9 880.87 313.1 880.86 313.29zM845.11 313.23c0 0.04 0 0.08 0.01 0.12-0.01-0.21-0.01-0.43-0.01-0.65L845.11 313.23zM866.673 849.43c-5.03-37.45-16.03-73.61-32.69-107.48-3.26-6.62-6.71-13.13-10.37-19.51-0.01-0.02-0.02-0.04-0.04-0.06-15.86-26.86-35.32-51.8-58-74.06l-0.01-0.01c-4.93-4.84-10.01-9.56-15.24-14.14-37.29-32.68-80.34-56.91-126.25-71.65 8.31-4.6 16.35-9.76 24.07-15.47 8.79-6.48 17.16-13.68 25.03-21.55 41.39-41.39 64.19-96.43 64.19-154.97 0-58.54-22.8-113.58-64.19-154.97-40.64-40.64-94.44-63.35-151.78-64.17-0.91-0.01-1.82-0.02-2.73-0.02-0.91 0-1.82 0.01-2.73 0.02-57.34 0.82-111.14 23.53-151.78 64.17-41.39 41.39-64.19 96.43-64.19 154.97 0 58.54 22.8 113.58 64.19 154.97 7.87 7.87 16.24 15.07 25.03 21.55 7.72 5.71 15.76 10.87 24.07 15.47-45.91 14.74-88.96 38.97-126.25 71.65-5.23 4.58-10.31 9.3-15.24 14.14-22.7 22.28-42.18 47.24-58.05 74.13-3.66 6.38-7.11 12.89-10.37 19.51-16.66 33.87-27.66 70.03-32.69 107.48-1.61 12 6.81 23.03 18.8 24.64 0.99 0.13 1.98 0.2 2.95 0.2 0.89 0 1.76-0.05 2.63-0.16 8.67-1.89 15.67-8.96 17.03-18.25 10.1-69.32 43.14-132.31 90.63-180.28 56.36-56.95 133.07-92.74 215.97-92.88l0.47 0c82.72 0.28 159.25 36.04 215.5 92.88 47.49 47.97 80.53 110.96 90.63 180.28 1.36 9.27 8.33 16.33 16.98 18.24 0.02 0 0.03 0.01 0.05 0.01 0.87 0.11 1.74 0.16 2.63 0.16 0.97 0 1.96-0.07 2.95-0.2C859.863 872.46 868.283 861.43 866.673 849.43zM518.193 545.86c-0.44 0-0.88 0-1.32-0.01-81.8-0.6-154.73-57.43-174.66-133.66-0.22-0.83-0.44-1.67-0.64-2.51-3.12-12.6-4.78-25.7-4.78-39.15 0-13.45 1.66-26.7 4.78-39.52 0.2-0.86 0.42-1.71 0.64-2.56 20.04-78.14 93.65-140.25 175.98-140.25l0.94 0c82.33 0 155.94 62.11 175.98 140.25 0.22 0.85 0.44 1.7 0.64 2.56 3.12 12.82 4.78 26.07 4.78 39.52 0 13.45-1.66 26.55-4.78 39.15-0.2 0.84-0.42 1.68-0.64 2.51-19.93 76.23-92.86 133.06-174.66 133.66C519.703 545.86 518.953 545.86 518.193 545.86z" ></path></symbol><symbol id="icon-mima" viewBox="0 0 1024 1024"><path d="M791.366 459.07l-459.174-0.791c-0.186-61.936-16.847-157.926 36.027-216.192 32.142-35.52 86.326-72.068 144.127-72.068 85.395 0 149.246 64.412 180.166 144.126 9.009 22.992 16.936 35.38 36.037 36.037 47.899 1.45 44.986-49.075 36.029-72.067C719.914 163.03 636.118 97.953 512.346 97.953c-84.12 0-130.475 17.265-180.154 72.065-76.009 83.746-72.259 219.151-72.067 288.26l-26.795 0.791c-25.045 0-45.273 20.034-45.273 44.667v378.249c0 24.774 20.269 44.755 45.273 44.755h557.99c25.009 0 45.273-19.989 45.273-44.755V503.737c0.046-24.678-20.218-44.667-45.227-44.667zM765.68 818.35c0 9.966-3.476 18.514-10.58 25.52-7.045 7.051-15.56 10.58-25.517 10.58H296.362c-9.966 0-18.472-3.478-25.475-10.58-7.051-7.049-10.624-15.553-10.624-25.52V565.635c0-19.878 16.166-36.054 36.098-36.054h433.212c19.932 0 36.107 16.176 36.107 36.054V818.35z" fill="" ></path></symbol></svg>',d=(d=document.getElementsByTagName("script"))[d.length-1].getAttribute("data-injectcss"),r=function(e,t){t.parentNode.insertBefore(e,t)};if(d&&!e.__iconfont__svg__cssinject__){e.__iconfont__svg__cssinject__=!0;try{document.write("<style>.svgfont {display: inline-block;width: 1em;height: 1em;fill: currentColor;vertical-align: -0.1em;font-size:16px;}</style>")}catch(e){console&&console.log(e)}}function a(){i||(i=!0,c())}function s(){try{o.documentElement.doScroll("left")}catch(e){return void setTimeout(s,50)}a()}t=function(){var e,t=document.createElement("div");t.innerHTML=l,l=null,(t=t.getElementsByTagName("svg")[0])&&(t.setAttribute("aria-hidden","true"),t.style.position="absolute",t.style.width=0,t.style.height=0,t.style.overflow="hidden",t=t,(e=document.body).firstChild?r(t,e.firstChild):e.appendChild(t))},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(t,0):(n=function(){document.removeEventListener("DOMContentLoaded",n,!1),t()},document.addEventListener("DOMContentLoaded",n,!1)):document.attachEvent&&(c=t,o=e.document,i=!1,s(),o.onreadystatechange=function(){"complete"==o.readyState&&(o.onreadystatechange=null,a())})}(window);
!function(e){var t,n,c,o,i,l='<svg><symbol id="icon-touxiang" viewBox="0 0 1024 1024"><path d="M309.52 494.12c-1.94 0-3.47 0.28-4.67 0.76 1.63-0.49 3.37-0.76 5.16-0.76L309.52 494.12zM845.13 707.52c0.05-0.99 0.18-1.96 0.39-2.9C845.29 705.05 845.17 705.97 845.13 707.52zM880.86 313.29c0.01-0.04 0.01-0.09 0.01-0.13l0-0.46C880.87 312.9 880.87 313.1 880.86 313.29zM845.11 313.23c0 0.04 0 0.08 0.01 0.12-0.01-0.21-0.01-0.43-0.01-0.65L845.11 313.23zM866.673 849.43c-5.03-37.45-16.03-73.61-32.69-107.48-3.26-6.62-6.71-13.13-10.37-19.51-0.01-0.02-0.02-0.04-0.04-0.06-15.86-26.86-35.32-51.8-58-74.06l-0.01-0.01c-4.93-4.84-10.01-9.56-15.24-14.14-37.29-32.68-80.34-56.91-126.25-71.65 8.31-4.6 16.35-9.76 24.07-15.47 8.79-6.48 17.16-13.68 25.03-21.55 41.39-41.39 64.19-96.43 64.19-154.97 0-58.54-22.8-113.58-64.19-154.97-40.64-40.64-94.44-63.35-151.78-64.17-0.91-0.01-1.82-0.02-2.73-0.02-0.91 0-1.82 0.01-2.73 0.02-57.34 0.82-111.14 23.53-151.78 64.17-41.39 41.39-64.19 96.43-64.19 154.97 0 58.54 22.8 113.58 64.19 154.97 7.87 7.87 16.24 15.07 25.03 21.55 7.72 5.71 15.76 10.87 24.07 15.47-45.91 14.74-88.96 38.97-126.25 71.65-5.23 4.58-10.31 9.3-15.24 14.14-22.7 22.28-42.18 47.24-58.05 74.13-3.66 6.38-7.11 12.89-10.37 19.51-16.66 33.87-27.66 70.03-32.69 107.48-1.61 12 6.81 23.03 18.8 24.64 0.99 0.13 1.98 0.2 2.95 0.2 0.89 0 1.76-0.05 2.63-0.16 8.67-1.89 15.67-8.96 17.03-18.25 10.1-69.32 43.14-132.31 90.63-180.28 56.36-56.95 133.07-92.74 215.97-92.88l0.47 0c82.72 0.28 159.25 36.04 215.5 92.88 47.49 47.97 80.53 110.96 90.63 180.28 1.36 9.27 8.33 16.33 16.98 18.24 0.02 0 0.03 0.01 0.05 0.01 0.87 0.11 1.74 0.16 2.63 0.16 0.97 0 1.96-0.07 2.95-0.2C859.863 872.46 868.283 861.43 866.673 849.43zM518.193 545.86c-0.44 0-0.88 0-1.32-0.01-81.8-0.6-154.73-57.43-174.66-133.66-0.22-0.83-0.44-1.67-0.64-2.51-3.12-12.6-4.78-25.7-4.78-39.15 0-13.45 1.66-26.7 4.78-39.52 0.2-0.86 0.42-1.71 0.64-2.56 20.04-78.14 93.65-140.25 175.98-140.25l0.94 0c82.33 0 155.94 62.11 175.98 140.25 0.22 0.85 0.44 1.7 0.64 2.56 3.12 12.82 4.78 26.07 4.78 39.52 0 13.45-1.66 26.55-4.78 39.15-0.2 0.84-0.42 1.68-0.64 2.51-19.93 76.23-92.86 133.06-174.66 133.66C519.703 545.86 518.953 545.86 518.193 545.86z" ></path></symbol><symbol id="icon-mima" viewBox="0 0 1024 1024"><path d="M791.366 459.07l-459.174-0.791c-0.186-61.936-16.847-157.926 36.027-216.192 32.142-35.52 86.326-72.068 144.127-72.068 85.395 0 149.246 64.412 180.166 144.126 9.009 22.992 16.936 35.38 36.037 36.037 47.899 1.45 44.986-49.075 36.029-72.067C719.914 163.03 636.118 97.953 512.346 97.953c-84.12 0-130.475 17.265-180.154 72.065-76.009 83.746-72.259 219.151-72.067 288.26l-26.795 0.791c-25.045 0-45.273 20.034-45.273 44.667v378.249c0 24.774 20.269 44.755 45.273 44.755h557.99c25.009 0 45.273-19.989 45.273-44.755V503.737c0.046-24.678-20.218-44.667-45.227-44.667zM765.68 818.35c0 9.966-3.476 18.514-10.58 25.52-7.045 7.051-15.56 10.58-25.517 10.58H296.362c-9.966 0-18.472-3.478-25.475-10.58-7.051-7.049-10.624-15.553-10.624-25.52V565.635c0-19.878 16.166-36.054 36.098-36.054h433.212c19.932 0 36.107 16.176 36.107 36.054V818.35z" fill="" ></path></symbol></svg>',d=(d=document.getElementsByTagName("script"))[d.length-1].getAttribute("data-injectcss"),r=function(e,t){t.parentNode.insertBefore(e,t)};if(d&&!e.__iconfont__svg__cssinject__){e.__iconfont__svg__cssinject__=!0;try{document.write("<style>.svgfont {display: inline-block;width: 1em;height: 1em;fill: currentColor;vertical-align: -0.1em;font-size:16px;}</style>")}catch(e){console&&console.log(e)}}function a(){i||(i=!0,c())}function s(){try{o.documentElement.doScroll("left")}catch(e){return void setTimeout(s,50)}a()}t=function(){var e,t=document.createElement("div");t.innerHTML=l,l=null,(t=t.getElementsByTagName("svg")[0])&&(t.setAttribute("aria-hidden","true"),t.style.position="absolute",t.style.width=0,t.style.height=0,t.style.overflow="hidden",t=t,(e=document.body).firstChild?r(t,e.firstChild):e.appendChild(t))},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(t,0):(n=function(){document.removeEventListener("DOMContentLoaded",n,!1),t()},document.addEventListener("DOMContentLoaded",n,!1)):document.attachEvent&&(c=t,o=e.document,i=!1,s(),o.onreadystatechange=function(){"complete"==o.readyState&&(o.onreadystatechange=null,a())})}(window);
\ No newline at end of file
{
{
"id": "",
"name": "",
"font_family": "iconfont",
"css_prefix_text": "icon-",
"description": "",
"glyphs": [
{
"icon_id": "700853",
"name": "头像",
"font_class": "touxiang",
"unicode": "e655",
"unicode_decimal": 58965
},
{
"icon_id": "1279441",
"name": "密码",
"font_class": "mima",
"unicode": "e660",
"unicode_decimal": 58976
}
]
}
@font-face {
@font-face {
font-family: "iconfont"; /* Project id */
src: url('iconfont.ttf?t=1645352388797') format('truetype');
}
.iconfont {
font-family: "iconfont" !important;
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-touxiang:before {
content: "\e655";
}
*{
margin: 0;
padding: 0;
}
body{
scrollbar-width: none; /* firefox */
-ms-overflow-style: none; /* IE 10+ */
overflow-x: hidden;
overflow-y: hidden;
background-image: url(https://gitee.com/hyyyyyy_l/images/raw/master/登录页面背景.jpg);
background-repeat: no-repeat;
background-size: cover;
width: 1520px;
height: 1002px;
}
#back_library_home{
color: rgba(255, 255, 255, 0.5);
font-family: "正楷";
font-size:20px;
text-decoration:none;
cursor: pointer;
}
.login_register_box{
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
}
div section:nth-child(1){
height: 252px;
}
div section:nth-child(2){
height: 750px;
/* flex: 1; */
}
/* @font-face {
font-family: 白丹魂心;
src: url(../../fonts/白舟魂心书体字体.ttf);
} */
@font-face {
font-family: 粗隶;
src: url(../../fonts/逐浪粗隶书法体字体.ttf);
}
/* 第一块 */
.head{
position:relative;
/* margin-top: 70px; */
/* margin-left: ; */
width: 880px;
/* height: 350px; */
font-size: 50px;
font-family: 粗隶;
color: white;
display: flex;
flex-direction: column;
justify-content: space-around;
}
#head_one{
/*align-self: flex-start;*/
font-size:100px;
top: 10px;
left:0px;
position:absolute;
}
#head_two{
/*align-self: flex-end;*/
position:absolute;
font-size:100px;
top: 140px;
right: 0px;
}
/* 第二块 */
input{
padding-left: 10px;
color: rgba(255, 255, 255, 0.7);
width: 357px;
height: 48px;
font-family: 粗隶;
background-color: rgba(0, 0, 0, 0);
border-style: solid;
border-width: 1px;
border-color: rgba(255, 255, 255, 0.7);
border-radius: 10px;
}
button{
width: 143px;
height: 48px;
color: rgba(255, 255, 255, 0.7);
font-family: 粗隶;
background-color: rgba(0, 0, 0, 0);
border-style: solid;
border-width: 1px;
border-color: rgba(255, 255, 255, 0.7);
border-radius: 10px;
cursor: pointer;
}
/* 用户头像 */
.user_avatar{
position: relative;
top: 10px;
/* justify-self: flex-start; */
width: 357px;
height: 50px;
display: flex;
flex-direction: row;
justify-content: center;
}
@font-face {
font-family: "iconfont"; /* Project id */
src: url('iconfont.ttf?t=1645352388797') format('truetype');
}
.iconfont_1 {
font-family: "iconfont" !important;
color: rgba(255, 255, 255, 0.7);
font-size: 40px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
border-width: 1px;
border-radius: 50px;
border-style: solid;
border-color: rgba(255, 255, 255, 0.7);
align-self: flex-end;
margin-bottom: 20px;
}
hr{
width: 370px;
height: 1px;
border: none;
background-color: rgba(255, 255, 255, 0.7);
}
/* 登陆页面 */
.login_body{
width: 357px;
height: 462px;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-content: center;
}
/* 登录的输入框设置 */
.login_body_input{
margin-top: 15px;
margin-bottom: 15px;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
}
#login_body_input_one{
margin-top: 20px;
}
@font-face {
font-family: "iconfont"; /* Project id */
src: url('iconfont.ttf?t=1645352388797') format('truetype');
}
.iconfont_2 {
font-family: "iconfont" !important;
color: rgba(255, 255, 255, 0.7);
font-size: 20px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
margin-right: 10px;
}
#iconfont_2{
margin-top: 20px;
}
/* 登录时输入的下拉框设置 >> 账号数 */
#account_num{
color: rgba(255, 255, 255, 0.5);
display: block;
border-radius: 10px;
}
/* 记住密码、自动登录 忘记密码 */
.login_body_check{
margin-top: 5px;
margin-bottom: 10px;
width: 357px;
height: 45px;
color: rgba(255, 255, 255, 0.7);
/* position: relative; */
font-family: 粗隶;
display: flex;
flex-direction: row;
justify-content:space-between;
align-items: flex-start;
}
.login_body_check .forget_password{
/* position: absolute; */
margin-right: 15px;
cursor: pointer;
/* justify-self: flex-end; */
}
/* .remember_password{
margin: 10px;
}
.auto_login{
margin: 10px;
}
.forget_password{
justify-self: flex-end;
margin: 10px;
} */
#remember_password{
margin-left: 15px;
width: 10px;
height: 10px;
background-color: rgba(0, 0, 0, 0);
border-width: 1px;
border-style: solid;
border-color: rgba(255, 255, 255, 0.7);
border-radius: 5px;
}
#auto_login{
width: 10px;
height: 10px;
background-color: rgba(0, 0, 0, 0);
border-width: 1px;
border-style: solid;
border-color: rgba(255, 255, 255, 0.7);
border-radius: 5px;
}
/* #forget_password{
margin-left: 270px;
} */
/* 登录的按钮设置 */
.login_body_button{
display: flex;
flex-direction: row;
justify-content: space-between;
}
/* #login_body_button_one{
}
#login_body_button_two{
} */
/* 验证码 */
.verification_code{
margin-top: 15px;
/* width: 357px; */
display: flex;
flex-direction: row;
justify-content: space-between;
}
#img{
width: 100px;
height: 50px;
border-width: 2px;
border-style: double;
border-color: rgba(255, 255, 255, 0.7);
border-radius: 5px;
}
#verification_code_input{
width: 235px;
height: 50px;
border-width: 1px;
border-style: solid;
border-color: rgba(255, 255, 255, 0.7);
border-radius: 10px;
}
/* 注册页面 */
.register_body{
width: 357px;
height: 462px;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
}
/* 注册的输入框设置 */
.register_body_input{
margin-left: 15px;
margin-top: 10px;
margin-bottom: 10px;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
}
/* *的设置 */
#register_body_must_input{
margin-left: 10px;
color: red;
}
#register_body_input_name{
margin-top: 35px;
}
p{
align-self: flex-start;
font-size: 10px;
color: rgba(247, 6, 6, 0.7);
}
/* 注册的按钮设置 */
.register_body_button{
margin-top: 15px;
margin-bottom: 10px;
width: 357px;
display: flex;
flex-direction: row;
justify-content: space-between;
}
/* #register_body_button_one{
justify-self: flex-start;
}
#register_body_button_two{
justify-self: flex-end;
} */
<!DOCTYPE html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=, initial-scale=1.0">
<script type="text/javascript" src="https://lib.baomitu.com/jquery/3.6.0/jquery.js"></script>
<link rel="stylesheet" type="text/css" href="./library_login_register.css/library_login_register.css">
<link rel="stylesheet" type="text/css" href="../头像和密码/iconfont.css">
<title>登录注册页面</title>
</head>
<body>
<div id='back_library_home'><<返回主页面</div>
<div class="login_register_box">
<section class="head">
<h1 id="head_one">云斋晓开卷</h1>
<h1 id="head_two">独共圣人语</h1>
</section>
<section>
<!-- 用户头像 -->
<div class="user_avatar">
<span class="iconfont_1">&#xe655;</span>
</div>
<hr/>
<!-- 登陆页面 -->
<span class="login_body">
<div class="login_body_input">
<!-- 输入学号框中的用户头像 -->
<span class="iconfont_2" id="iconfont_2">&#xe655;</span>
<input id="login_body_input_one" type="text" placeholder="请输入您的学号" list="account_num">
<!-- 输入学号中的下拉展示 -->
<datalist id="account_num">
<!-- 1.items:要被循环的信息,可以是数组,Java集合
2.var:可选项,指定迭代之的别名
3.varStatus:可选项,当前迭代的状态信息;
4.begin:可选项,迭代开始的元素,起始下标为 0;
5.end:可选项,迭代结束的元素;
6.step:可选项,迭代的步长;
-->
<c:forEach var="num" items="${wuliaocp}">
<option value="您的帐号"></option>
</c:forEach>
</datalist>
</div>
<div class="login_body_input">
<!-- 输入框中的密码锁图标 -->
<span class="iconfont_2">&#xe660;</span>
<input id="login_body_input_two" type="password" placeholder="请输入您的密码">
</div>
<!-- 验证码 -->
<div class="verification_code">
<tr>
<td colspan="2">
<img id="img" src="https://gitee.com/lidouble/lilihao-img/raw/master/lilihao-bookimg/书42.png">
</td>
</tr>
<div class="verification_code_input">
<input type="text" id="verification_code_input" placeholder="请输入验证码">
</div>
</div>
<!-- 记住密码、自动登录 忘记密码 -->
<div class="login_body_check">
<div class="remember_password">
<input type="checkbox" name="rememberMe" id="remember_password"> 记住密码
</div>
<div class="auto_login">
<input type="checkbox" name="autoLogin" id="auto_login"> 自动登录
</div>
<div class="forget_password" id="forget_password">忘记密码</div>
</div>
<div class="login_body_button">
<button id="login_body_button_one">用户登录</button>
<button id="login_body_button_two">注册</button>
</div>
</span>
<!-- 注册页面 -->
<span class="register_body">
<div class="register_body_input">
<input type="text" id="register_body_input_name" placeholder="姓名">
<div id="register_body_must_input">*</div>
</div>
<div class="register_body_input">
<input type="text" id="register_body_input_stnum" placeholder="学号">
<div id="register_body_must_input">*</div>
</div>
<div class="register_body_input">
<input type="text" id="register_body_input_telnum" placeholder="手机号">
<div id="register_body_must_input">*</div>
</div>
<div class="register_body_input">
<input type="text" id="register_body_input_email" placeholder="邮箱">
<div id="register_body_must_input">*</div>
</div>
<div class="register_body_input">
<input type="password" id="register_body_input_password" placeholder="密码">
<div id="register_body_must_input">*</div>
</div>
<p>注:密码应包含大小写字母、数字、特殊字符,长度在6-15内</p>
<div class="register_body_input">
<input type="password" id="register_body_input_confirm_password" placeholder="确认密码">
<div id="register_body_must_input">*</div>
</div>
<div class="register_body_button">
<button id="register_body_button_one" >确认</button>
<button id="register_body_button_two" >取消</button>
</div>
</span>
</section>
</div>
</body>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<!-- <script type="text/javascript" src="https://cdn.bootcdn.net/ajax/libs/axios/0.26.0/axios.js"></script> -->
<script src="./library_login_register.js/library_login_register.js"></script>
</html>
\ No newline at end of file
window.onload=function(){
$('div#back_library_home').click(function(){
window.location.href='../首页/library_home.html';
})
/* 登录页面 */
$(document).ready(function(){
$('span.register_body').hide();
})
// 注册按钮点击
$('button#login_body_button_two').click(function(){
$('span.login_body').hide();
$('span.register_body').show();
})
/* 注册页面 */
// 忘记密码点击跳转
$('div#forget_password.forget_password').click(function(){
$('span.login_body').hide();
$('span.register_body').show();
})
// 取消按钮点击
$('button#register_body_button_two').click(function(){
$('span.login_body').show();
$('span.register_body').hide();
})
//邮箱正则表达式判断
function email_rejust(){
let input_email=document.getElementById('register_body_input_email');
let obtn=document.getElementsById('register_body_button_one');
obtn.onclick=function(){
let reg=(/^[a-zA-Z0-9_-]+@(qq|163)+(\.(com|cn)+)+$/);
if(reg!=/^[a-zA-Z0-9_-]+@(qq|163)+(\.(com|cn)+)+$/){
alert('邮箱格式错误');
}
}
}
}
axios.defaults.baseURL = "http://eebw6y.natappfree.cc"
// let message = new Array(3)
// message[0]={
// login_stnum:'202100'
// }
// alert设置
window.alert = function(msg){
let maskBg = '#0000002b'; //蒙版展示色
let zIndex = 999999; //修改弹出层z-index,应为最顶层,避免被覆盖
let desColor = 'white'; //提示信息字体颜色
let buttonVal = '确定'; //确定按钮名称
let btnBgColor = '#0aade3'; //确定按钮背景颜色
let btnColor = '#ffffff'; //确定按钮字体颜色
let btnAlign = 'center'; //按钮在水平位置,默认居中,变量值:left,center,right
let style = `
<style class="mask-style">
.box-sizing{
box-sizing: border-box;
}
.alertMask{
position: fixed; /*生成绝对定位的元素,相对于浏览器窗口进行定位*/
display: flex;
display: webkit-flex;
flex-direction: row;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: `+zIndex+`;
background: `+maskBg+`;
}
.alertContainer{
min-width: 240px; /*容器最小240px*/
max-width: 320px; /*容器最大320px*/
background:rgba(0,0,0,0.95);
border: 1px solid `+maskBg+`;
border-radius: 50px;
color: `+desColor+`;
overflow: hidden;
font-size:20px;
}
.alertDes{
padding: 35px 40px;
text-align: center;
letter-spacing: 1px;
font-size: 20px;
color: `+desColor+`;
}
.alertDes img{
max-width: 100%;
height: auto;
}
.alertConfirmParent{
width: 100%;
padding: 20px 30px;
text-align: `+btnAlign+`;
box-sizing: border-box;
background: black;
}
.alertConfirmBtn{
cursor: pointer;
padding: 8px 10px;
border: none;
border-radius: 20px;
color: `+btnColor+`;
background-color: `+btnBgColor+`;
box-shadow: 0 0 2px `+btnBgColor+`;
}
</style>
`;
let head = document.getElementsByTagName('head')[0];
head.innerHTML += style //头部加入样式,注意不可使用document.write()写入文件,否则出错
const body = document.getElementsByTagName('body')[0];
let alertMask = document.createElement('div');
let alertContainer = document.createElement('div');
let alertDes = document.createElement('div');
let alertConfirmParent = document.createElement('div');
let alertConfirmBtn = document.createElement('button');
body.append(alertMask);
alertMask.classList.add('alertMask');
alertMask.classList.add('box-sizing');
alertMask.append(alertContainer);
alertContainer.classList.add('alertContainer');
alertContainer.classList.add('box-sizing');
alertContainer.append(alertDes);
alertDes.classList.add('alertDes');
alertDes.classList.add('box-sizing');
alertContainer.append(alertConfirmParent);
alertConfirmParent.classList.add('alertConfirmParent');
alertConfirmParent.classList.add('box-sizing');
alertConfirmParent.append(alertConfirmBtn);
alertConfirmBtn.classList.add('alertConfirmBtn');
alertConfirmBtn.classList.add('box-sizing');
alertConfirmBtn.innerText = buttonVal;
//加载提示信息
alertDes.innerHTML = msg;
//关闭当前alert弹窗
function alertBtnClick(){
body.removeChild(alertMask);
maskStyle = head.getElementsByClassName('mask-style')[0];
head.removeChild(maskStyle); //移除生成的css样式
}
alertConfirmBtn.addEventListener("click", alertBtnClick);
}
// 点击登录传入数据(学号,密码)
$('button#login_body_button_one').click(function login_input(){
let login_stnum=$('#login_body_input_one').val();
let login_password=$('#login_body_input_two').val();
axios({
method:'post',
url:'javaProject2/LoginServlet',
data:{
student_id:login_stnum,
user_password:login_password,
}
}).then(function(response){
console.log(response.data);
console.log(response.status);
console.log(response.returnvalue);
let login_num= response.returnvalue;
if(login_num==0){
alert('输入错误');
}else if(login_num==1){
localStorage.setItem('user_uuid',login_num);
window.location.href = '../../首页/library_home.html';
}else{
localStorage.setItem('user_uuid',login_num);
window.location.href = '../../index.html';
}
})
})
// /* 验证码 */
// $('button#login_body_button_one').click(function verification_code_input(){
// let verification_num=$('#verification_code_input').val();
// axios({
// method:'post',
// url:'',
// data:{
// verification_num='',
// }
// }).then(function(response){
// console.log(response.data);
// console.log(response.status);
// })
// })
// $(function () {
// $("#img").click(function () {
// $(this).prop("src","login_input_checkCodeServlet?id="+Math.random());
// });
// });
// // 记住密码
// let login_input_stnum = document.getElementById('login_body_input_one');
// let login_input_pswd = document.getElementById('login_body_input_two');
// let login_input_check = document.getElementById('remember_password');
// let locallogin_input_stnum = localStorage.getItem('login_input_stnum') || ''; //获取到login_input_stnum的值并保存
// let locallogin_input_pswd = localStorage.getItem('login_input_pswd') || ''; //获取到login_input_pswd的值并保存
// let (login_input_stnum).value = locallogin_input_stnum;
// let (login_input_pswd).value = locallogin_input_pswd;
// if (locallogin_input_stnum !== '' && locallogin_input_pswd !== '') {
// login_input_check.setAttribute('login_input_checked', '');
// }
// let justify=-1;
// $('button#login_body_button_one').click(function(){
// if (login_input_check.login_input_checked) {
// localStorage.setItem('login_input_stnum', login_input_stnum.value);
// localStorage.setItem('login_input_pswd', login_input_pswd.value);
// } else {
// localStorage.setItem('login_input_stnum', '');
// localStorage.setItem('login_input_pswd', '');
// }
// })
// 传入数据(姓名,学号,手机号,邮箱,密码,确认密码)
$('button#register_body_button_one').click(()=>{
let register_name=$('#register_body_input_name').val();
// let register_name = document.getElementById('register_body_input_name').value
// console.log(document.getElementById('register_body_input_name').value)
console.log(register_name);
let register_stnum=$('#register_body_input_stnum').val();
let register_telnum=$('#register_body_input_telnum').val();
let register_email=$('#register_body_input_email').val();
let register_login_input_pswdword=$('#register_body_input_password').val();
let register_confirm_login_input_pswdword=$('#register_body_input_confirm_password').val();
axios({
method:'post',
url:'javaProject2/RegisterServlet',
data:{
username:register_name,
student_id:register_stnum,
phone_number:register_telnum,
qq_mail:register_email,
user_password:register_login_input_pswdword,
repassword:register_confirm_login_input_pswdword,
}
}).then(function(response){
console.log(response.data);
console.log(response.status);
console.log(response.data.returnvalue);
let register_num= response.data.returnvalue;
// console.log(register_num);
switch(register_num){
case 1:
console.log('运行成功');
alert('数据不能为空');
break;
case 2:
alert('请输入正确的学号格式');
break;
case 3:
alert('密码长度应该在6-15内');
break;
case 4:
alert('密码应包含大小写字母、数字、特殊字符');
break;
case 5:
alert('请输入正确的手机号码');
break;
case 6:
alert('两次密码输入不一致');
break;
case 7:
alert('注册成功');
// alertConfirmBtn.onclick(function(){
// $('span.login_body').css("display","block");
// $('span.register_body').css("display","none");
// })
window.location.href='./library_login_register.html';
break;
case 8:
alert('注册失败,请重新注册');
break;
case 9:
alert('youxiangcuowu');
break;
}
})
})
// $('#123').click(function(){
// let num= 1;
// if(num==0){
// alert('输入错误');
// }else if(num==1){
// window.location.href = '../首页/library_home.html'
// }else{
// window.location.href = './index.html'
// }
// })
*{
margin: 0;
padding: 0;
}
body{
scrollbar-width: none; /* firefox */
-ms-overflow-style: none; /* IE 10+ */
overflow-x: hidden;
overflow-y: hidden;
background-image: url(https://gitee.com/hyyyyyy_l/images/raw/master/library_home_background.jpg);
background-repeat: no-repeat;
background-size: cover;
width: 1520px;
height: 1002px;
/* z-index: 1; */
}
.home_box{
background-color: rgba(0, 0, 0, 0.5);
width: 100%;
height: 100%;
min-width: 1000px;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
}
.logo{
width: 1520px;
height: 300px;
display: flex;
flex-direction: row;
justify-content: space-between;
/* align-content: center; */
}
img{
width: 500px;
height: 300px;
}
/* #yunding_logo{
width: 400px;
height: 300px;
}
#lingyun_logo{
width: 400px;
height: 300px;
} */
@font-face {
font-family: 粗隶;
src: url(../../fonts/逐浪粗隶书法体字体.ttf);
}
#home_body{
/* margin-top: 10px; */
font-family: 粗隶;
}
h1{
text-align: center;
font-size: 100px;
color: rgba(255, 255, 255, 1);
}
.home_button{
margin-top: 100px;
margin-bottom: 200px;
width: 150px;
height: 50px;
color: white;
display: flex;
justify-content: center;
align-items: center;
border-style: solid;
border-width: 1px;
border-color: white;
border-radius: 25px;
text-align: center;
font-size: 18px;
font-family: serif;
cursor: pointer;
}
#home_button{
font-family: 粗隶;
}
p{
/* font-size: 18px; */
color: rgba(255, 255, 255, 0.7);
font-family: 粗隶;
}
.contact_us{
justify-self: flex-end;
width: 1000px;
display: flex;
flex-direction: row;
justify-content: space-between;
flex-wrap: wrap;
align-content: space-between;
}
#contact_us{
width: 130px;
margin: 10px;
/* justify-self: flex-end; */
}
\ No newline at end of file
<!DOCTYPE html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script type="text/javascript" src="https://lib.baomitu.com/jquery/3.6.0/jquery.js"></script>
<link rel="stylesheet" type="text/css" href="./library_home.css/library_home.css">
<title>首页</title>
</head>
<body>
<!-- <div id="222">测试</div> -->
<div class="home_box" id="home_box">
<div class="logo">
<img id="yunding_logo" src="https://gitee.com/hyyyyyy_l/images/raw/master/云顶logo.png">
<img id="lingyun_logo" src="https://gitee.com/hyyyyyy_l/images/raw/master/凌云logo.png">
</div>
<div id="home_body">
<h1>欢迎使用图书借阅系统</h1>
</div>
<div class="home_button" id="home_button" type="button">点击进入</div>
<div class="contact_us">
<p id="contact_us">QQ联系我们:</p>
<p id="contact_us">姬鹏翔:2867197851</p>
<p id="contact_us">胡雅丽:2457681931</p>
<p id="contact_us">王显政:2923193486</p>
<p id="contact_us">孙梧桐:2673408959</p>
<p id="contact_us">燕超超:2895548613</p>
<p id="contact_us">陈彦兆:1256244812</p>
<p id="contact_us">李李昊:2998000782</p>
<p id="contact_us">崔馨之:1091759979</p>
<p id="contact_us">谢松值:2954295419</p>
<p id="contact_us">谭振宁:1666105922</p>
<p id="contact_us">刘永生:2233734713</p>
</div>
</div>
</body>
<script src="./libray_home.js/library_home.js"></script>
</html>
\ No newline at end of file
// 点击进入
$('div.home_button').click(function(){
console.log('1');
window.location.href='../登录注册页面/library_login_register.html'
})
// $('div#222').click(function(){
// window.location.href = '../登录注册页面/index.html'
// })
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment