head | zip358.com~`DeoxyriboNucleicAcid`~

コード書き初め、そろそろネタが尽きてきたよ「始め」！？

2022.01.03

コード書き初めは何が良いのかなぁなどと考えておりましたが、やはりこれかなっていう事で文字のグラデーションを徐々に変えてい行くものを作ってみました。IEとかでは動きませんが、最新のChromeやFirefox、エッジなどでは動くかなと思います。ソースコードを写景してみて、コードの動きがわかればソースコードを変更していろいろと試してみてください。

Rewind 2021 – the Love of the Code

動作はこちらから確認くださいませ。

https://zip358.com/tool/demo51/

尚、このコードは２０２１年の１２月２８日に書いたものになります。

<!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">
<meta name="Description" content="Enter your description here"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.6.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
<title>Happy New Year 2022</title>
<style>
    body{
        background-color: black;
    }
    #HNY{
        font-weight: bold;
        font-size: 222px;
    }
</style>
</head>
<body>
    <h1 id='HNY'>Happy New Year 2022</h1>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.slim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.1/umd/popper.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.6.0/js/bootstrap.min.js"></script>
<script>
    let color1 =["40","E0","D0"];
    let color2 =["FF","8C","00"];
    let color3 =["FF","00","80"];
    let postion =[2,0,1];
    setInterval(() => {
        if((parseInt(color1[postion[0]],16) + 1)<255){
            color1[postion[0]] = (parseInt(color1[postion[0]],16) + 1).toString(16);
        }else{
            color1[postion[0]] = (100).toString(16);
            postion[0]--;
        }
        if((parseInt(color2[postion[1]],16) + 1)<255){
            color2[postion[1]] = (parseInt(color2[postion[1]],16) + 1).toString(16);
        }else{
            color2[postion[1]] = (50).toString(16);
            postion[1]--;
        }
        if((parseInt(color3[postion[2]],16) + 1)<255){
            color3[postion[2]] = (parseInt(color3[postion[2]],16) + 1).toString(16);
        }else{
            color3[postion[2]] = (80).toString(16);
            postion[2]--;
        }
        
        for(key in postion){
            if(postion[key]<=-1){
                postion[key] = 2;
            }
        }
        //console.log(`#${color1.join("")}, #${color2.join("")}, #${color3.join("")}`);
        document.getElementById('HNY').style = `
        color: #FF8C00;
  background: -webkit-linear-gradient(0deg, #${color1.join("")}, #${color2.join("")}, #${color3.join("")});
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
        `;    
    }, 70);
</script>
</body>
</html>

タグ

12, 2021, 28, 8, cGLonkCQ, charset, Chrome, com, D-, DOCTYPE, Firefox, gt, head, html, https, IE, ja, lang, lt, meta, name, quot, UTF-, viewport, watch, www, youtube, いろいろ, エッジ, グラデーション, コード, こちら, これ, ソース, ネタ, もの, 事, 何, 写, 動作, 変更, 文字, 景, 書き初め, 最新, 確認,

外部VPSサーバーからさくらレンタルサーバーのDBに接続する方法。

2020.12.04

Logging

外部VPSサーバーからさくらレンタルサーバーのDB（データベース）に接続する方法は下記のコードだけでは上手く動かない。だけど、tmpファイルを生成時にパーティションにu+xの権限を与えればこのコードは要件をみたします。因みにプロセスが残ったままになるので接続が終わったら、プロセスを削除してあげてください。なのでどのプロセスを削除する機能として追加しないと使えないかな？、時間があれば完成したコードをアップします。

なお、変数の初期値はご自身で入れてください。あとポート開放やexpectが入っていない場合はyumなどでインストールする必要もあります。

<!DOCTYPE html>
<html lang="en">

<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">
	<meta name="Description" content="Enter your description here" />
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.2/css/bootstrap.min.css">
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.0/css/all.min.css">
	<link rel="stylesheet" href="assets/css/style.css">
	<title>ssh sqli</title>
</head>

<body>
	<?php
	print ssh_sqli_connect();
	?>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.1/umd/popper.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.2/js/bootstrap.min.js"></script>
</body>

</html>
<?php
function ssh_sqli_connect()
{
	global $dblink,$dbname,$sshuser, $sshhost, $sshpassword,$host,$sshport;
	$ret = null;
	$cmd = "#!/usr/bin/expect -f
set timeout 3
expect -c \"spawn ssh -f -N -L $sshport:$host:3306 $sshuser@$sshhost -oStrictHostKeyChecking=no
expect \\\"$sshuser@$sshhost's password:\\\"
send \\\"$sshpassword\\n\\\"
\"
";

	$tmpfname = tempnam(sys_get_temp_dir(), 'ssh');

	$handle = fopen($tmpfname, "w");
	fwrite($handle, $cmd);
   	shell_exec("sh $tmpfname");
	sleep(3);
	$dblink = db_connect();
	try{
		for($id = 1 ;$id<=99;$id++){
			$ret = $dblink->query("SELECT * FROM $dbname.X.xtbl where $dbname.X.xtbl.id=$id;");
			if ($cnt = (int) mysqli_num_rows($ret)) {
			  $row = mysqli_fetch_assoc($ret);
			  print ($row["id"].", ".$row["name"]);
			}
		}
	}catch(PDOException $e){
		echo "失敗: " . $e->getMessage() . "\n";
	}

	fclose($handle);
	unlink($tmpfname);

	db_close();
	return "未完成";
}

function db_connect()
{
	global $dblink, $host, $user, $password, $dbname,$sshport;
	try {
		$dblink = new  mysqli("127.0.0.1", "$user", $password, $dbname ,$sshport);
		//$dblink->set_charset("utf8");
		return $dblink;
	} catch (PDOException $e) {
		echo "接続失敗: " . $e->getMessage() . "\n";
	}
}

function db_close()
{
	global $dblink;
	$dblink->close();
}

タグ

8, charset, db, DOCTYPE, en, expect, gt, head, html, lang, lt, meta, name, quot, tmp, UTF-, vie, VPS, yum, アップ, インストール, コード, ご自身, サーバー, さくら, データベース, パーティション, ファイル, プロセス, ポート, まま, レンタル, 下記, 初期, 削除, 場合, 変数, 外部, 完成, 必要, 接続, 方法, 時間, 権限, 機能, 生成, 要件, 追加, 開放,

jqueryのイベント処理時に引数を受け渡す方法を知っとくと良いかもしれません。

2020.03.10

Logging

jqueryのイベント処理時に引数を受け渡す方法を知っとくと良いかもしれません。記述は下記になります。ぐぐると出てくるので知っている人の方が多いかもしれませんが…。ちなみに自分はこの記述方法、ごくまれにしか使わないため、忘れてしまいます。event.dataに紐づけてくれるのはとても良いかなと自分は思っていますが、皆さんはいかがでしょうか？もうjqueryなんか使わないよという方もいると思うのですが、自分が思うにゴリゴリ書くよりか、jqueryで済ませれるところは使ったほうがコードは短くて済むと思っています。WEB業界は技術の移り変わりが早いですよね。逆にソフトのほうはWEBよりはスパンが長い気がします。

https://zip358.com/tool/demo9/

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script src="common.js"></script>
    <title>Document</title>
</head>
<body>
    <p id="pen">お腹空いた(´；ω；｀)お腹空いたと＞φ(..)</p>
</body>
</html>

$(function(){
    $("#pen").click({sword:"The pen is mightier than the sword"},function(e){
        $(this).text(e.data.sword);
    });
    // $("#pen").on("click",{sword:"The pen is mightier than the sword"},function(e){
    //     $(this).text(e.data.sword);
    // });
});

タグ

charset, data, DOCTYPE, EVENT, gt, head, html, ja, jquery, lang, lt, meta, quot, web, いかが, イベント, かな, コード, スパン, ソフト, ため, ところ, 下記, 人, 処理, 引数, 技術, 方, 方法, 業界, 気, 皆さん, 紐, 自分, 記述, 逆,

都道府県にカーソルを乗せると色が変わるちょっとした奴ムフ。

2020.03.09

Logging

JSONファイル、JSファイル、htmlファイルはそれぞれ下記になります。ちなみにいま作っている、あるサービスに使うために作ったもののお裾分けです。雛形として作っているのでおそらく、編集しやすいかなと思います。なお、SVGファイルは自分のソースからダウンロードするか、提供元のSVGをダウンロードするかしてください。ちなみにSVGは日本地図の標準をダウンロードしています。

デモ8：： https://zip358.com/tool/demo8/

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script src="common.js"></script>
    <title>Document</title>
</head>
<body onload="ken()">
    <object id="svg_ken" data="jpn03_a4.svg" type="image/svg+xml" width="700" height="700"></object><br>
    <a target="new456" rel="license" href="http://creativecommons.org/licenses/by-nc/2.1/jp/"><img alt="Creative Commons License" style="border-width: 0" src="http://i.creativecommons.org/l/by-nc/2.1/jp/88x31.png"></a><br>
    データ引用元：<a target="new123" href="https://www.kabipan.com/geography/whitemap/">https://www.kabipan.com/geography/whitemap/</a><br>
</body>
</html>

{
    "kenmei":[
        {"id":"1","ken":"北海道","eiji":"HOKKAIDO"},
        {"id":"2","ken":"青森県","eiji":"AOMORI"},
        {"id":"3","ken":"岩手県","eiji":"IWATE"},
        {"id":"4","ken":"宮城県","eiji":"MIYAGI"},
        {"id":"5","ken":"秋田県","eiji":"AKITA"},
        {"id":"6","ken":"山形県","eiji":"YAMAGATA"},
        {"id":"7","ken":"福島県","eiji":"FUKUSHIMA"},
        {"id":"8","ken":"茨城県","eiji":"IBARAKI"},
        {"id":"9","ken":"栃木県","eiji":"TOCHIGI"},
        {"id":"10","ken":"群馬県","eiji":"GUNMA"},
        {"id":"11","ken":"埼玉県","eiji":"SAITAMA"},
        {"id":"12","ken":"千葉県","eiji":"CHIBA"},
        {"id":"13","ken":"東京都","eiji":"TOKYO"},
        {"id":"14","ken":"神奈川県","eiji":"KANAGAWA"},
        {"id":"15","ken":"新潟県","eiji":"NIIGATA"},
        {"id":"16","ken":"富山県","eiji":"TOYAMA"},
        {"id":"17","ken":"石川県","eiji":"ISHIKAWA"},
        {"id":"18","ken":"福井県","eiji":"HUKUI"},
        {"id":"19","ken":"山梨県","eiji":"YAMANASHI"},
        {"id":"20","ken":"長野県","eiji":"NAGANO"},
        {"id":"21","ken":"岐阜県","eiji":"GUFU"},
        {"id":"22","ken":"静岡県","eiji":"SIZUOKA"},
        {"id":"23","ken":"愛知県","eiji":"AICHI"},
        {"id":"24","ken":"三重県","eiji":"MIE"},
        {"id":"25","ken":"滋賀県","eiji":"SHIGA"},
        {"id":"26","ken":"京都府","eiji":"KYOTO"},
        {"id":"27","ken":"大阪府","eiji":"OSAKA"},
        {"id":"28","ken":"兵庫県","eiji":"HYOGO"},
        {"id":"29","ken":"奈良県","eiji":"NARA"},
        {"id":"30","ken":"和歌山県","eiji":"WAKAYAMA"},
        {"id":"31","ken":"鳥取県","eiji":"TOTTORI"},
        {"id":"32","ken":"島根県","eiji":"SHIMANE"},
        {"id":"33","ken":"岡山県","eiji":"OKAYAMA"},
        {"id":"34","ken":"広島県","eiji":"HIROSHIMA"},
        {"id":"35","ken":"山口県","eiji":"YAMAGUCHI"},
        {"id":"36","ken":"徳島県","eiji":"TOKUSHIMA"},
        {"id":"37","ken":"香川県","eiji":"KAGAWA"},
        {"id":"38","ken":"愛媛県","eiji":"EHIME"},
        {"id":"39","ken":"高知県","eiji":"KOUCHI"},
        {"id":"40","ken":"福岡県","eiji":"FUKUOKA"},
        {"id":"41","ken":"佐賀県","eiji":"SAGA"},
        {"id":"42","ken":"長崎県","eiji":"NAGASAKI"},
        {"id":"43","ken":"熊本県","eiji":"KUMAMOTO"},
        {"id":"44","ken":"大分県","eiji":"OOITA"},
        {"id":"45","ken":"宮崎県","eiji":"MIYAZAKI"},
        {"id":"46","ken":"鹿児島県","eiji":"KAGOSHIMA"},
        {"id":"47","ken":"沖縄県","eiji":"OKINAWA"}
        ]
}


function ken() {
    $.getJSON("ken.json", function (json) {
        var svg_ken = document.getElementById('svg_ken').contentDocument;
        var ken = $(svg_ken);
        ken.find('path').attr('fill', '#fff');
        ////
        for (var i = 0; i < 47; i++) {
        ken.find("[id='" + json.kenmei[i].eiji + "']").on("click",{i:i,json:json},function (event) {
            window.location.href = "/page/" + event.data.json.kenmei[event.data.i].id;
        });
        }
        ////
        for (var i = 0; i < 47; i++) {
            ken.find("[id='" + json.kenmei[i].eiji + "']").hover(
                function () {
                    $(this).attr('fill', '#4080ff');
                },
                function () {
                    $(this).attr('fill', '#fff');
                });
        }
    });
}

タグ

358, 8, charset, com, content, demo, device-widt, DOCTYPE, gt, head, html, https, ja, JS, json, lang, lt, meta, name, quot, SVG, tool, UTF-, viewport, Width, zip, いま, お裾分け, カーソル, サービス, ソース, それぞれ, ダウンロード, ため, デモ, ファイル, ムフ, 下記, 地図, 奴, 提供, 日本, 標準, 編集, 自分, 色, 都道府県, 雛形,

PHP非同期の考え方サンプル。

2019.11.12

Logging

非同期の考え方サンプルです。
さて非同期ってなんでしょうか？
非同期とは次から次へと仕事をお願いする状態。
仕事量が重いと結果が返るまで時間がかかります。
なので、Aという仕事が重く、B、Cという仕事が楽な場合は
A、B、Cという仕事を順番に頼んでもAの結果はBの後やCの後に
結果が返ってきます。

逆に同期処理とは何か？
A、B、C の順に仕事を頼むと、Aの仕事が終えた後にB、Cと仕事を
行います。

非同期＝並列処理と考えると良いかも。
同期処理＝逐次処理と考えると良いかも。

https://www.youtube.com/watch?v=VHlW65WPUDY

<!DOCTYPE html>
<html lang="en">
<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://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <title>Document</title>
    <script>
        $(function(){
            $("#btn").on("click",function(){
                test();
                return false;
            })
        });
        function test(){
            var data = $("#frm").serialize();
            $.ajax({
                type: "post",
                url: "url.php",
                data: data,
                dataType: "json",
                success: function (response) {
                    console.log(response);
                }
            });
        }
    </script>
</head>
<body>
    <a href="#" id="btn">クリック</a>
    <form id="frm">
        <input type="text" name="test1">
        <input type="text" name="test2">
        <input type="text" name="test3">
    </form>
</body>
</html>

<?php
//url.php
$data = [];
if(!is_null($_POST)){
    foreach($_POST as $key=>$val){
        $data[$key] = $val;
    }
    print(json_encode($data));
}else{
    print(0);
}

タグ

65, 8, charset, com, DOCTYPE, en, gt, head, html, lang, lt, meta, name, php, quot, UTF-, VHlW, WPUDY, youtube, お願い, サンプル, 並列, 仕事, 何, 処理, 同期, 場合, 後, 時間, 次, 状態, 結果, 考え方, 逆, 順, 順番,

もし今、自分が小学生だったら自由研究でこんなの作ってると思いたい。

2019.08.24

Logging

もし今、自分が小学生だったら自由研究でこんなの作ってると思いたい。
自動で九九表を生成するjQueryなんかを作ってそう。
(いまの小学生が羨ましいなw夏休み一日中ネットに浸っているだろう）
デモサイトはこちら
https://zip358.com/tool/demo5/index-12.php

<!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">
    <title>九九表</title>
    <link rel="stylesheet" href="../MDB-Free_4.8.5/css/bootstrap.css" >
    <link rel="stylesheet" href="../MDB-Free_4.8.5/css/mdb.css" >
    <link rel="stylesheet" href="../fontawesome-free-5.9.0-web/css/all.css">
    <script src="../jquery/jquery-3.4.1.js"></script>
</head>
<body>
<form>
    <div class="form-group">
        <label for="exampleInputEmail1">数字を入力してください</label>
        <input type="text" class="form-control" id="inp" aria-describedby="inp" placeholder="数字を入力してください(デフォルト(9))">
        <small id="emailHelp" class="form-text text-muted">1以下の数字、数字以外、または桁が2桁を超えた場合デフォルトを表示します</small>
    </div>
    </form>
    <span id="tbl99"></span>
    <script>
        $(function(){
            var cc = function(){
                var c=$(this).val().match(/[0-9]{1,2}/) && Number($(this).val())>1?$(this).val():9;
                $("#tbl99").html(c99(c));
                return c;
            };
           $("#tbl99").html(function(){
                c99($("#inp").val(cc));
           });
           $("#inp").on("keyup",cc);
           $("#inp").on("keydown",cc);
        });
        function c99(c){
            var str="<h1><span class="badge badge-primary">九九表</span></h1>";
                var x = y = c;
                str+="<table class="table table-striped table-dark table-bordered">";
                for(var i=1;i<=x;i++){
                    str+="<tr>";
                    for(var ii=1;ii<=y;ii++){
                        var s = i * ii;
                        str+="<td>" + i + " × " + ii + " = " + s + "</td>";
                    }
                    str+="</tr>";
                }
                str+="</table>";
                return str;
        }
    </script>
</body>
</html>

タグ

1.0, 358, 5, 8, charset, com, content, demo, device-width, DOCTYPE, edge, gt, head, html, http-equiv, IE, index, initial-scale, ja, jquery, lang, lt, meta, name, php, tool, UTF-, viewport, Width, X-UA-Compatible, zip, いま, こちら, サイト, でも, なん, ネット, 九九, 今, 夏休み, 小学生, 生成, 研究, 自分, 自動, 自由,

Canvasで円がぐるぐる回る。

2019.03.09

Logging

<!DOCTYPE html>
<html>
    <head>
    </head>
<body>
    <canvas id="ctx" ></canvas>
    <script>
            "use strict";
            let x = 0,y = 0;
            let xs = 300,ys = 300;
            let xc = 1,yc = 1;
            let ctx = document.querySelector("#ctx");
            let canvas;
            ctx.width = window.screen.width;
            ctx.height = window.screen.height;
            if(ctx.getContext)
            {
               canvas = ctx.getContext("2d");
               setInterval(draw,77);
            }
            function draw(){
               canvas.beginPath();
               canvas.fillStyle = "#3399ff";
               canvas.arc(x,y,35,0,Math.PI*2,true);
               canvas.globalCompositeOperation = "xor";
               canvas.fill();
                x =((Math.sin (xc) * xs)) + 500;
                y =(Math.cos(yc) * ys) + 500;
                console.log(x + ":" + ctx.width);
                console.log(y + ":" + ctx.height);
                if(x < 0 || x > ctx.width)
                {
                   xs*=-1;
                }
                if(y < 0 || y > ctx.height)
                {
                    ys*=-1;
                }
                if(x<0)
                {
                    x=0;
                }
                if(y<0)
                {
                    y=0;
                }
                if(x > ctx.width)
                {
                    x=ctx.width;
                }
                if( y > ctx.height)
                {
                    y=ctx.height;
                }
                xc+=1
                if(xc>360)
                {
                    xc=0;
                }
                yc+=1
                if(yc>360)
                {
                    yc=0;
                }
            }
        </script>
</body>
</html>

Canvasでぐるぐる円を廻す。
ガラクタコードが少しあります、最初違うコードを書いていたので
これを可変していろいろお試しください。
https://zip358.com/tool/demo5/js/index-3.html

タグ

0, １, 300, body, Canvas, ctx, DOCTYPE, document, gt, head, Height, html, ID, let, lt, querySelector, screen, script, strict, use, Width, win, window, xc, xs, yc, YS, 円,

javascriptでEVENT処理レベル1

2019.03.09

Logging

<!DOCTYPE html>
<html>
    <head>
    </head>
<body>
    <input type="text" class="zyezyezye">
    <script>
            "use strict";
            let zyezyezye = document.querySelector(".zyezyezye");
            zyezyezye.addEventListener("input",()=>{
                console.log(">おいら>>" + zyezyezye.value);
                if(zyezyezye.value=="じぇじぇじぇ")
                {
                    console.log("おいら>>ｷﾀ━━━━(ﾟ∀ﾟ)━━━━!!nおいら>>じぇじぇじぇn<<ストーカーかよ!!");
                }
            });
        </script>
</body>
</html>

jqueryばかり書いているとこういう書き方、書かなくなる。
jqueryから世の中はjavascriptやvue.jsなどへシフトしているそうだけど、未だにjqueryばかり書いている自分です。なれないといけないと思いつつ！？
別のことに力を注いでいる毎日です。
ちなみに「じぇじぇじぇ」は方言で驚きを指す言葉だとか。

タグ

１, addEventListener, body, class, console, DOCTYPE, document, EVENT, gt, head, html, if, input, javascript, let, log, lt, querySelector, script, strict, Text, type, use, value, zyezyezye, おいら, レベル, 処理,

ANA旅割逆算日導きサービスモバイル版：最終

2016.05.04

Logging

<!DOCTYPE html>
<html>
    <head>
        <title>ANA旅割逆算日導きサービス（mobile）</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="jquery-mobile/jquery.mobile-1.4.5.min.css">
    <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:300,400,700">
    <script src="jquery-mobile/jquery.js"></script>
    <script src="jquery-mobile/jquery.mobile-1.4.5.min.js"></script>
    <style>
        .ui-page{
           background:#73cbe6;
        }
    </style>
    <script>
        $(function(){
            $("#ckday").click(function(){
                //alert($("#day").val().replace(/\-/g,'\/'));
            $.ajax({
                type: 'POST',
                url: "../ana_calendar/json.php",
                data:{day:$("#day").val().replace(/\-/g,'\/')},
                dataType: 'json',
                success: function(obj){
                    var str =   '<ul id="ana_listview" data-role="listview">\n';
                    str = str + '<li>予定日：' + obj.anaday + '</li>\n';
                    str = str + '<li>75日［旅割］の予約期日：' + obj.day75 + '</li>\n';
                    str = str + '<li>55日［旅割］の予約期日：' + obj.day55 + '</li>\n';
                    str = str + '<li>45日［旅割］の予約期日：' + obj.day45 + '</li>\n';
                    str = str + '<li>28日［旅割］の予約期日：' + obj.day28 + '</li>\n';
                    str = str + '<li>21日［旅割］の予約期日：' + obj.day21 + '</li>\n';
                    str = str + '</ul>\n';
                    $("#ana_api").html(str);
                    $("#ana_listview").listview().listview('refresh'); ;
                    }
                });
            });
        });
    </script>
    </head>
    <body>
        <div data-role="page" data-title="ANA旅割逆算日導きサービス（mobile）">
          <!--ヘッダー領域-->
          <div data-role="header">
            <h1>ANA旅割逆算日導きサービス（mobile）</h1>
          </div>
          <div role="main" class="ui-content">
              <input type="date" id="day">
              <button id="ckday" class="ui-btn">逆算する。</button>
              <span id="ana_api"></span>
          </div>
          <div data-role="footer">
            <h3>Copyright zip358.com</h3>
          </div>
        </div>
    </body>
</html>

ANA旅割逆算日導きサービスモバイル版：最終として webから逆算日を導きだすサービスを公開します。
ほんと・・・簡単なものですので最初からwebで作れたんじゃねぇっていう疑惑があると思うです。
webｺﾞﾆｮｺﾞﾆｮ…(ﾉﾟдﾟ(;￣Д￣)っていう誘惑はモバイル版のアプリを作る時からありましたがアプリ作るよって言ったので、有言実行ということで作ってみました。
作った結果ですけど・・・ウェブで作れるものはウェブで作ったほうが手間暇かからないという事がわかりました。 http://zip358.com/tool/ana_calendar/?［PC］
zip358.com/tool/ANAmobile/?[モバイル] ?

タグ

1.0, 1.4.5, 8, ANA, charset, content, css, device-width, DOCTYPE, gt, head, href, html, http, initial-scale, jquery, jquery-mobile, link, lt, meta, min, mobile, name, quot, rel, stylesheet, title, UTF-, viewport, Width, サービス, モバイル, 旅割, 最終, 逆算,

共有:

共有:

共有:

共有:

共有:

共有:

共有:

共有:

共有: