You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
331 lines
12 KiB
331 lines
12 KiB
<!DOCTYPE html>
|
|
<html lang="zh-Hant-TW">
|
|
<head>
|
|
<!-- Google Tag Manager -->
|
|
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
|
|
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
|
|
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
|
|
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
|
|
})(window,document,'script','dataLayer','GTM-TS4X59X');</script>
|
|
<!-- End Google Tag Manager -->
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1" />
|
|
<meta http-equiv="X-UA-Compatible" content="IE=9" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0">
|
|
<meta name="description" content="">
|
|
<title>線上諮詢 - 永佳捷電梯</title>
|
|
<link rel="icon" sizes="48x48" href="images/header/favicon.ico" type="image/x-icon" />
|
|
<link rel="shortcut icon" sizes="48x48" href="images/header/favicon.ico" type="image/x-icon" />
|
|
<link rel="Bookmark" sizes="48x48" href="images/header/favicon.ico" type="image/x-icon" />
|
|
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
|
|
<link rel="stylesheet" type="text/css" href="css/all.min.css">
|
|
<link rel="stylesheet" type="text/css" href="css/animate.min.css" />
|
|
<link rel="stylesheet" type="text/css" href="css/creer.css">
|
|
<style>
|
|
.error {
|
|
color:red !important;
|
|
}
|
|
</style>
|
|
<!-- Google tag (gtag.js) -->
|
|
<script async src="https://www.googletagmanager.com/gtag/js?id=G-HZGXDG5Y12"></script>
|
|
<script>
|
|
window.dataLayer = window.dataLayer || [];
|
|
function gtag(){dataLayer.push(arguments);}
|
|
gtag('js', new Date());
|
|
|
|
gtag('config', 'G-HZGXDG5Y12');
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<!-- Google Tag Manager (noscript) -->
|
|
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-TS4X59X"
|
|
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
|
|
<!-- End Google Tag Manager (noscript) -->
|
|
<header w3-include-html="include/header.html"></header>
|
|
<div id="pre-loader">
|
|
<div class="spinner">
|
|
<div class="rect1"></div>
|
|
<div class="rect2"></div>
|
|
<div class="rect3"></div>
|
|
<div class="rect4"></div>
|
|
<div class="rect5"></div>
|
|
</div>
|
|
</div>
|
|
<main class="contact-page">
|
|
<section class="banner-area text-center">
|
|
<div class="page-title"></div>
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-lg-12">
|
|
<div class="page-title-name">
|
|
<h2>線上諮詢</h2>
|
|
</div>
|
|
<nav style="--bs-breadcrumb-divider: '/';" aria-label="breadcrumb">
|
|
<ol class="breadcrumb">
|
|
<li class="breadcrumb-item"><a href="index.html">首頁</a></li>
|
|
<li class="breadcrumb-item active" aria-current="page">線上諮詢</li>
|
|
</ol>
|
|
</nav>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<section class="page-info position-relative home-contact">
|
|
<div class="container">
|
|
<header class="section-title wow fadeInDown">
|
|
<b>contact</b>
|
|
<h1>永佳捷解決方案探索</h1>
|
|
<p>歡迎您詳實填寫現況和需求，後續永佳捷專業顧問將會立即與您接洽並請留意E-mail信箱</p>
|
|
</header>
|
|
<div class="card-wrap">
|
|
<div class="card-container position-relative">
|
|
<form id="contactform" role="form" method="post" action="">
|
|
<div class="row">
|
|
<div class="col-md-6">
|
|
<div class="form-field">
|
|
<input id="firstname" type="text" class="form-control" name="firstname" placeholder="姓氏*" required>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="form-field">
|
|
<input id="lastname" type="text" class="form-control" name="lastname" placeholder="名字*" required>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="form-field">
|
|
<select class="form-select" aria-label="gender" id="gender" name="gender">
|
|
<option disabled selected value="1">選擇性別*</option>
|
|
<option value="男">男</option>
|
|
<option value="女">女</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="form-field">
|
|
<input id="company" type="text" class="form-control" name="company" placeholder="公司名稱/社區名稱*" required>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="form-field">
|
|
<input id="email" type="email" class="form-control" name="email" placeholder="E-mail*" required>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="form-field">
|
|
<input id="tel" type="tel" class="form-control" name="tel" placeholder="電話*" required>
|
|
</div>
|
|
</div>
|
|
<!-- <div class="col-md-6">
|
|
<div class="form-field">
|
|
<input id="area" type="text" class="form-control" name="area" placeholder="使用場域*" required>
|
|
</div>
|
|
</div> -->
|
|
<div class="col-md-6">
|
|
<div class="form-field">
|
|
<select class="form-select" aria-label="job" id="job" name="job">
|
|
<option disabled selected value="1">職稱*</option>
|
|
<option value="社區管理">社區管理</option>
|
|
<option value="業主">業主</option>
|
|
<option value="建築師">建築師</option>
|
|
<option value="營建主管/包商">營建主管/包商</option>
|
|
<option value="開發商">開發商</option>
|
|
<option value="建築顧問">建築顧問</option>
|
|
<option value="其他(請說明)">其他(請說明)</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="form-field">
|
|
<select class="form-select" aria-label="service" id="service" name="service" required>
|
|
<option disabled selected value="1">選擇服務*</option>
|
|
<option value="電梯維保">電梯維保</option>
|
|
<option value="改修、改造">改修、改造</option>
|
|
<option value="新梯諮詢">新梯諮詢</option>
|
|
<option value="電梯健診">電梯健診</option>
|
|
<option value="意見反饋">意見反饋</option>
|
|
<option value="其他">其他</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="form-field">
|
|
<select class="form-select" aria-label="where" id="where" name="where" required>
|
|
<option disabled selected value="1">請問您是在哪裡獲得永佳捷智能電梯的資訊的呢?*</option>
|
|
<option value="自行搜尋">自行搜尋</option>
|
|
<option value="LINE廣告">LINE廣告</option>
|
|
<option value="Yahoo新聞">Yahoo新聞</option>
|
|
<option value="其他網路管道">其他網路管道</option>
|
|
<option value="親友推薦">親友推薦</option>
|
|
<option value="永佳捷同仁走訪/邀請">永佳捷同仁走訪/邀請</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-12">
|
|
<div class="form-field">
|
|
<textarea class="form-control" id="textarea" name="textarea" rows="3" placeholder="請留下您的需求描述或意見回饋*" required></textarea>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-12 row">
|
|
<div class="form-field col-sm-6">
|
|
<a>謝謝您到訪，提交解決方案諮詢表單，表示您已經瞭解並同意接受下方「隱私權政策-關於個人資料處理」的所有權與約定。</a><br>
|
|
<a href="policy.html" target="_blank" style="color:#f44336;">隱私權政策-關於個人資料處理</a>
|
|
</div>
|
|
<div class="form-field col-sm-6">
|
|
<div style="position:relative;top:40%;">
|
|
<input type="checkbox" id="checkPolicy" name="checkPolicy" style="height:25px;width:25px;margin-right:5px;" required><label for="checkPolicy">同意</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="form-field">
|
|
<input id="contact_verify" type="text" class="form-control" name="verify" placeholder="驗證碼*" required>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="verifyimg">
|
|
<a href="#" onclick="document.getElementById('captcha').src = 'securimage/securimage_show.php?' + Math.random(); return false"><img id="captcha" src="securimage/securimage_show.php" alt="CAPTCHA Image" style="width:150px;float:left;" /></a>
|
|
<span class="mobile-note" style="float:left;text-align:left;margin-left:10px;">點擊驗證圖片可更換<br>驗證碼不區分大小寫</span>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-12 text-center">
|
|
<button type="submit" class="btn-draw btn-orange" id="sendContact">送出表單</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
<footer w3-include-html="include/footer.html"></footer>
|
|
<a href="javascript:void(0);" class="scrollup">
|
|
<span class="scrollup-txt">TOP</span>
|
|
<div class="read-more-line">
|
|
<div class="line"></div>
|
|
<div class="dot"></div>
|
|
</div>
|
|
</a>
|
|
<a href="tel:+886800803666" class="call-btn">
|
|
<img src="images/footer/call.png" alt="" class="img-fluid">
|
|
立即電話諮詢
|
|
</a>
|
|
<script type="text/javascript" src="js/jquery-3.6.0-min.js"></script>
|
|
<script type="text/javascript" src="js/bootstrap.bundle.min.js"></script>
|
|
<script type="text/javascript" src="js/wow.min.js"></script>
|
|
<script src="common/js/sweetalert.min.js"></script>
|
|
<script src="common/js/jquery.validate.min.js"></script>
|
|
<script type="text/javascript" src="js/creer.js"></script>
|
|
<script>
|
|
$().ready(function() {
|
|
$("#contactform").validate({
|
|
errorPlacement: function(error, element) {
|
|
// if(element.is( ":checkbox" )){
|
|
// // error append here
|
|
// error.appendTo(element.parent().parent().parent().parent());
|
|
// }else{
|
|
// error.appendTo(element.parent('div'));
|
|
// }
|
|
error.appendTo(element.parent('div'));
|
|
},
|
|
rules: {
|
|
firstname: {
|
|
required: true
|
|
},
|
|
lastname: {
|
|
required: true,
|
|
minlength: 2
|
|
},
|
|
gender: "required",
|
|
company: {
|
|
required: true,
|
|
minlength: 2
|
|
},
|
|
email: {
|
|
required: true,
|
|
email: true
|
|
},
|
|
tel: {
|
|
required: true,
|
|
minlength: 2
|
|
},
|
|
// area: "required",
|
|
job: "required",
|
|
service: "required",
|
|
textarea: "required",
|
|
checkPolicy: "required",
|
|
verify: "required"
|
|
},
|
|
messages: {
|
|
firstname: {
|
|
required: "請輸入姓氏"
|
|
},
|
|
lastname: {
|
|
required: "請輸入名字",
|
|
minlength: "請輸入至少2個字"
|
|
},
|
|
gender: "請選擇性別",
|
|
company: {
|
|
required: "請輸入公司/社區名稱",
|
|
minlength: "請輸入至少2個字"
|
|
},
|
|
email: "請輸入有效的 E-mail 格式",
|
|
tel: {
|
|
required: "請輸入電話",
|
|
minlength: "請輸入至少2個字"
|
|
},
|
|
// area: "請輸入文字",
|
|
job: "請選擇職稱",
|
|
service: "請選擇服務",
|
|
textarea: "請輸入文字",
|
|
checkPolicy: "請勾選是否同意隱私權",
|
|
verify: "請輸入驗證碼"
|
|
},
|
|
errorElement: "span",
|
|
submitHandler: function() {
|
|
sendForm();
|
|
}
|
|
});
|
|
});
|
|
|
|
function sendForm() {
|
|
dataLayer.push({'eventCategory':'線上諮詢','eventAction':'CTA','eventLabel':'送出表單','event':'ga-event'});
|
|
$("#sendContact").prop("disabled", true);
|
|
var form = $("#contactform")[0];
|
|
var formData = new FormData(form);
|
|
$.ajax({
|
|
url: 'common/ajax/contact/Contact.php',
|
|
data: formData,
|
|
type: "POST",
|
|
encoding: "UTF-8",
|
|
dataType: "text",
|
|
processData: false,
|
|
contentType: false,
|
|
cache: false,
|
|
|
|
success: function(data) {
|
|
Swal.fire({
|
|
title: '送出成功',
|
|
text: '',
|
|
icon: 'success',
|
|
showConfirmButton: false,
|
|
timer: 1500
|
|
}).then(function() {
|
|
dataLayer.push({'eventCategory':'線上諮詢','eventAction':'表單','eventLabel':'成功','event':'ga-event'});
|
|
window.location.href = "thanks.html";
|
|
})
|
|
},
|
|
error: function(xhr, status, error) {
|
|
Swal.fire({
|
|
title: '',
|
|
html: xhr.responseText,
|
|
icon: 'error',
|
|
confirmButtonText: '確認'
|
|
});
|
|
}
|
|
});
|
|
$("#sendContact").prop("disabled", false);
|
|
};
|
|
|
|
</script>
|
|
</body>
|
|
</html>
|