PHP学習サイトでレベル20の問題をごねってみた。ゴネゴネ(´Д`)m

20150124

Logging


 
前回の記事で紹介したPHP学習サイトでレベル20の問題を解いてみました。実際、学習サイトでは解かなかったのですが一応、サンプルサイトを作ってみました(※最新のブラウザでしか表示されません)。作るにあたって苦になった所はゼロです(ΦωΦ)フフフ…。HTML5のFormタグ書いてゴニョゴニョ…(ノ゚д゚(; ̄Д ̄)。して送信しています。POSTで送信して自分自身でキャチした値を表示しています。かなり文字などは見えにくいですが、お遊びで作ったのでユーザー側の操作性などは知らんぷりです。送信ボタン押下後、一回ページが再度読み込まれたり違うページが読み込まれて処理される処理のことを同期処理といいます。じゃ非同期処理はどんなのっていうのを、今度、サンプルサイトを作ってみることにします。今回、重要なポイントはformタグ部分とPHPの処理部分です。その他はおまけです。※今回のサンプルコードで見て欲しかったのは、送信した時にHTMLタグなど記入されていたら変換している事とtextareaに改行コードが入っていたら改行して表示させているトコロがポイントです。あとの背景に動画流しているとか、そういうのはε-(´∀`*)ホッといてください自己満足の世界ですから・・・。
サンプルサイトを貼っときます。
https://zip358.com/tool/sample-echo/index.php
必要なファイル
同じ階層に必要なファイルindex.php,vide01.mp4(フリーの動画を引っ張ってきました(^^))
index.php

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>zip358.com:sample-echo?</title>
<style>
video {
    position: fixed;
    right: 0;
    bottom: 0;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
    background-size: cover;
}
textarea{
	width:250px;
	height:300px;
}
#main{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	width:650px;
	height:600px;
	background:#556B2F;
    filter:alpha(opacity=40);
    -moz-opacity: 0.4;
    opacity: 0.4;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 20px;
    -webkit-border-bottom-right-radius: 30px;
    -webkit-border-bottom-left-radius: 40px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 20px;
    -moz-border-radius-bottomright: 30px;
    -moz-border-radius-bottomleft: 40px;
}
#sub{
	width:250px;
	height:400px;
	overflow: scroll;
    filter:alpha(opacity=80);
    -moz-opacity: 0.8;
    opacity: 0.8;
	background:#fff;
	color:#DC143C;
	font-size:16px;
}
form{
	margin: 50px;
}
input,textarea{
	filter:alpha(opacity=80);
    -moz-opacity: 0.8;
    opacity: 0.8;
	color:#DC143C;
}
</style>
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<?php
?>
<video autoplay="" loop="" >
    <source src="./vide01.mp4" type="video/mp4">
</video>
<div id="main">
<table>
<tr>
<td>
<form action="./index.php" method="post">
<input type="text" / name="name"><br><br>
<textarea name="msg"></textarea><br><br>
<input type="submit" /><br>
</div>
</form>
</td>
<td>
<div id="sub">
<?php
	echo htmlspecialchars($_POST["name"])."<br><br>".nl2br(htmlspecialchars($_POST["msg"]));
?>
</td>
</tr>
</div>
</body>
</html>

タグ

AM,