Last active
October 17, 2018 09:48
-
-
Save Kazunari-h/c4159daf0a879b4f6f855811e7e8f9f9 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="ja"> | |
<head> | |
<meta charset="UTF-8"> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
<meta http-equiv="X-UA-Compatible" content="ie=edge"> | |
<script src="https://unpkg.com/axios/dist/axios.min.js"></script> | |
<script src="index.js"></script> | |
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" | |
crossorigin="anonymous"> | |
<title>サンプル</title> | |
</head> | |
<body> | |
<form id="main_form" class="needs-validation" novalidate> | |
<div class="form-group"> | |
<label for="name" class="row"> | |
<p class="col-sm-2 col-form-label">名前</p> | |
<p class="col-sm-10 row"> | |
<input type="text" name="name" id="name" class="form-control col-sm-12" placeholder="名前" required> | |
</p> | |
</label> | |
</div> | |
<div class="form-group"> | |
<label for="email" class="row"> | |
<p class="col-sm-2 col-form-label">メールアドレス</p> | |
<p class="col-sm-10 row"> | |
<input type="email" name="email" id="email" class="form-control col-sm-12" placeholder="メールアドレス" | |
required> | |
</p> | |
</label> | |
</div> | |
<div class="form-group"> | |
<label for="message" class="row"> | |
<p class="col-sm-2 col-form-label">メッセージ</p> | |
<p class="col-sm-10 row"> | |
<textarea name="message" id="message" cols="30" rows="10" class="form-control col-sm-12" | |
placeholder="問い合わせ内容" required></textarea> | |
</p> | |
</label> | |
</div> | |
</form> | |
<button id="btn" class="btn btn-primary col-sm-12">送信</button> | |
</body> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
window.onload = () => { | |
const btn = document.getElementById("btn"); | |
console.log(btn); | |
btn.addEventListener("click", () => { | |
const name_val = document.forms.main_form.name.value; | |
const mail_val = document.forms.main_form.email.value; | |
const message_val = document.forms.main_form.message.value; | |
if (!name_val || !mail_val || !message_val) { | |
alert("空"); | |
return; | |
} | |
axios | |
.get( | |
"https://maker.ifttt.com/trigger/sendmail/with/key/mATN60aXiSowj0OcrwSBqobudFa36fLI9qZvDxkd72n", | |
{ | |
params: { | |
value1: `${name_val}`, | |
value2: `${mail_val}`, | |
value3: `${message_val}` | |
}, | |
timeout: 1000, | |
responseType: "json", | |
crossdomain: true, | |
headers: { | |
"Content-Type": "application/json", | |
"Access-Control-Allow-Origin": "*" | |
} | |
} | |
) | |
.then(function(response) { | |
// 成功時 | |
console.log(response); | |
}) | |
.catch(function(error) { | |
// エラーが発生した場合 | |
console.log(error); | |
console.log(1234567890); | |
}) | |
.then(function() { | |
// 常に実行される | |
alert("送信が完了しました。"); | |
document.forms.main_form.name.value = ""; | |
document.forms.main_form.email.value = ""; | |
document.forms.main_form.message.value = ""; | |
}); | |
}); | |
}; |
<script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.7.1/css/lightbox.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.10.0/js/lightbox-plus-jquery.min.js" type="text/javascript"></script>
<a href="hoge.jpg" data-lightbox="fuga" data-title="hoge">
<img src="hoge_thumb.jpg" alt="hoge画像">
</a>
#lightbox .lb-container { padding: 3px; }
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
https://drive.google.com/drive/u/0/folders/11hxQMBzxSKaroq3Pc6Fqbj4gstoEy8-s