修改
This commit is contained in:
169
secure.html
Normal file
169
secure.html
Normal file
@@ -0,0 +1,169 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="stylesheet" href="./css/secure.css">
|
||||
<title>独立站安全</title>
|
||||
</head>
|
||||
<!-- 嵌入头部 -->
|
||||
<script type="text/javascript" src = "./js/jquery.js"></script>
|
||||
<script>
|
||||
$(function(){
|
||||
$("#header").load("./header.html");
|
||||
});
|
||||
$(function(){
|
||||
$("#footer").load("./footer.html");
|
||||
});
|
||||
</script>
|
||||
<body>
|
||||
<div class="secure">
|
||||
<div class="secure-box">
|
||||
<!-- 头部占位 -->
|
||||
<div id="header"></div>
|
||||
|
||||
<!-- 页面内容 -->
|
||||
<div class="secure-content-wrap">
|
||||
<div class="secure-content">
|
||||
|
||||
<div class="secure-content__left">
|
||||
<div class="secure-content--title">三种模式总有一款适合您</div>
|
||||
<div class="secure-content--model">
|
||||
<div class="secure-content--model__item">
|
||||
<div class="secure-content--model__round"></div>
|
||||
<div>如果您有独立站,可以直接购买安全微服务套餐</div>
|
||||
</div>
|
||||
<div class="secure-content--model__item">
|
||||
<div class="secure-content--model__round"></div>
|
||||
<div>您购买安全微服务套餐,我们送您独立站</div>
|
||||
</div>
|
||||
<div class="secure-content--model__item">
|
||||
<div class="secure-content--model__round"></div>
|
||||
<div>你可以只购买我们的独立站</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="secure-content__right">
|
||||
<img class="secure--content__right--image" src="./images/img2.png">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="secure-content--operate">
|
||||
<div class="secure-content--operate__made">定制我的套餐</div>
|
||||
<div class="secure-content--operate__connect" onclick="openPopup()">联系我们</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<!-- 底部占位 -->
|
||||
<div id="footer"></div>
|
||||
|
||||
<!-- 弹窗 -->
|
||||
<div id="mask" class="mask"></div>
|
||||
<div id="popup" class="secure-popup" style="display:none;">
|
||||
<div class="secure-popup__close" onclick="closePopup()">
|
||||
<img src="./images/close.png">
|
||||
</div>
|
||||
<div class="popup-content">
|
||||
<div class="popup-content__item">请留下您的联系方式,我们会尽快与您联系</div>
|
||||
<div class="popup-content__item"><input class="input" type="text" placeholder="姓名" id="inputName" /></div>
|
||||
<div class="popup-content__item"><input class="input" type="text" placeholder="电话" id="inputPhone" /></div>
|
||||
<div class="popup-content__item"><input class="input" type="text" placeholder="公司名称" id="inputCompany" /></div>
|
||||
<div class="popup-content__item popup-content__item2">
|
||||
<input class="inputCode" type="text" placeholder="验证码" id="inputCode" />
|
||||
<div class="codeImage"><img id="codeImg" onclick="changeCodeImg()" class="img" style="height: 56px"></div>
|
||||
</div>
|
||||
<div class="popup-content__btn" onclick="submitName()">提交</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="subpopup" class="secure-popup" style="display:none;">
|
||||
<div class="secure-popup__close" onclick="closePopupsub()">
|
||||
<img src="./images/close.png">
|
||||
</div>
|
||||
<div class="popup-content">
|
||||
<div id="subpopupmessage" class="popup-content__item"></div>
|
||||
<div class="popup-content__btn" id="subpopupmessageclose">关闭</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script>
|
||||
function openPopup() {
|
||||
document.getElementById("popup").style.display = "block";
|
||||
document.getElementById("mask").style.display = "block";
|
||||
$('#codeImg').attr('src', './loulan/captcha/captchaImage?type=math×tamp=' + Date.now());
|
||||
}
|
||||
|
||||
function closePopup() {
|
||||
document.getElementById("popup").style.display = "none";
|
||||
document.getElementById("mask").style.display = "none";
|
||||
}
|
||||
|
||||
// 提交名字函数
|
||||
function submitName() {
|
||||
let name = $('#inputName').val();
|
||||
let telephone = $('#inputPhone').val();
|
||||
let companyName = $('#inputCompany').val();
|
||||
let captcha = $('#inputCode').val();
|
||||
|
||||
$("#inputName").blur(function(){
|
||||
if(!name){
|
||||
$(this).removeClass("warning");
|
||||
}
|
||||
});
|
||||
$("#inputPhone").blur(function(){
|
||||
if(!telephone){
|
||||
$(this).removeClass("warning");
|
||||
}
|
||||
});
|
||||
$("#inputCompany").blur(function(){
|
||||
if(!companyName){
|
||||
$(this).removeClass("warning");
|
||||
}
|
||||
});
|
||||
$("#inputCode").blur(function(){
|
||||
if(!captcha){
|
||||
$(this).removeClass("warning");
|
||||
}
|
||||
});
|
||||
|
||||
if(!name){
|
||||
document.getElementById("inputName").classList.add("warning");
|
||||
document.getElementById("inputName").setAttribute("placeholder","请输入您的姓名");
|
||||
}
|
||||
if(!telephone){
|
||||
document.getElementById("inputPhone").classList.add("warning");
|
||||
document.getElementById("inputPhone").setAttribute("placeholder","请输入您的电话");
|
||||
}
|
||||
if(!companyName){
|
||||
document.getElementById("inputCompany").classList.add("warning");
|
||||
document.getElementById("inputCompany").setAttribute("placeholder","请输入公司名称");
|
||||
}
|
||||
if(!captcha){
|
||||
document.getElementById("inputCode").classList.add("warning");
|
||||
document.getElementById("inputCode").setAttribute("placeholder","请输入验证码");
|
||||
return;
|
||||
}
|
||||
|
||||
$.post('/loulan/business/buy/9', {'name':name,'telephone':telephone,'companyName':companyName,'captcha':captcha}, function (resp){
|
||||
|
||||
if (!!resp && !!resp.result) {
|
||||
alert('您的意向信息已提交,我们将尽快与您取得联系!');
|
||||
} else {
|
||||
alert(resp.message);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function changeCodeImg() {
|
||||
$('#codeImg').attr('src', './loulan/captcha/captchaImage?type=math×tamp=' + Date.now());
|
||||
}
|
||||
</script>
|
||||
</html>
|
||||
Reference in New Issue
Block a user