PHP 入力されたIDを次回アクセス時まで覚える（Cookie）
【input.php】
<?php
if( isset( $_COOKIE[ 'my_id' ] ) ){
$myId = $_COOKIE[ 'my_id' ];
} else {
$myId = '';
}
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>入力されたIDを次回アクセス時まで覚える（Cookie）</title>
<style>
h1 {
font-size: 20px;
}
dt {
margin-bottom: 10px;
}
dd {
margin-bottom: 20px;
}
</style>
</head>
<body>
<h1>入力されたIDを次回アクセス時まで覚える（Cookie）</h1>
<form action="cookie.php" method="post">
<dl>
<dt>ID</dt>
<dd><input type="text" name="my_id" id="my_id" value=" <?php print $myId; ?> "></dd>
<dt>パスワード</dt>
<dd><input type="password" name="password" id="password"></dd>
<dt>IDの保存</dt>
</dl>
<p><input type="checkbox" name="save" id="save" value="on">
<label for="save">IDを保存する</label></p>
<input type="submit" value="送信する">
</form>
</body>
</html>
<?php
$myId = $_POST['my_id'];
$password = $_POST['password'];
$save = $_POST['save'];
//Cookieに保存
if( $save == 'on' ){
setcookie( 'my_id',$myId,time() + 60 * 60 * 24 * 14 );
$message = 'ログイン情報を記録しました';
} else {
setcookie( 'my_id' );
$message = '記録しませんでした';
}
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>入力されたIDを次回アクセス時まで覚える (Cookie)</title>
<style>
h1 {
font-size: 20px;
}
</style>
</head>
<body>
<h1>入力されたIDを次回アクセス時まで覚える (Cookie)</h1>
<p><?php print $message; ?></p>
<p><a href="./input.php">戻る</p>
</body>
</html>
||<[f:id:takuya0805:20131023134338p:image]
*1382493605*HTML5 type="email"
・HTML5ではメールアドレスの入力を想定したinput要素のtype属性として「type="email"」が用意されています
・「type="email"」とした場合、「xxxx@ドメイン名」といったメールアドレス用の書式しか入力できなくなります
・正しくない書式のデータが入力された場合はには、送信時にチェックされ「メールアドレスを入力してください。」というメッセージが表示されます
>||
<th>メールアドレス</th>
<td><input name="mail" type="email" placeholder="yamada@example.co.jp" required>
<span class="note">（半角）</span></td>
||<[f:id:takuya0805:20131023134338p:image:w640]
*1382492665*HTML5 autofocus属性
・autofocus属性を使うことで、<span class="deco" style="color:#FF0033;">ページを開いたときに自動的に指定した項目にフォーカス</span>させることができるようになります
・この設定をしておくことで、ユーザーはすぐに入力を始めることができるようになります
・autofocus属性を指定できるのは、ページ内で１箇所のみです
>||
<th>お名前</th>
<td>
<label for="last_name">姓</label>
<input type="text" name="last_name" id="last_name" placeholder="山田" autofocus>
<label for="first_name">名</label>
<input type="text" name="first_name" td="first_name" cplaceholder="太郎"></td>
