【ＭＥＮＵ】
【htmlからjavascriptを介してphpを起動し、その結果(テキスト・画像)をhtmlに書き込む】
◆概要
※例えばphpのアクセスカウンターをindex.htmlに組み込みたい。index.htmlにphpスクリプトを記述してファイル名をindex.phpに変えるのが一番簡単なのだが、できればファイル名を変えたくない(SEO対策等)。
※phpをcgiとして起動することも試したが、javascriptを介して直接phpを起動し、その結果をhtmlに書き込むことができる方法があった。
◆javascript tips
//アクセスカウンター(acclog.php)の例
[XHTML]--テキスト出力も画像出力も同じ
Access counter:
<script type="text/javascript" src="
http://www.〜/acclog.php">
</script>
【肝】phpをjavascriptから起動する!!
[PHP](acclog.php)---テキスト出力
//$Count:アクセス数(MySQL等とのアクセスも可能)
<?php
...($Countを取得)
//結果をテキスト出力
header("Content-type: application/x-javascript");
print "document.write('['+'".$Count."+']')";
?>
[PHP](acclog.php)---gif画像出力(6桁ゼロ付で出力)
//$Count:アクセス数
//GifPath:gif画像を保存しているフォルダ(http://から)
//画像は、0.gif、1.gif、2.gif、3.gif....
<?php
...($Countを取得)
$imgStr=""; //html出力
$Count3=substr(($Count+1000000),1,6); //6桁の文字に変換
for($s=0;$s<=5;$s++){
$ss=$GifPath."/".substr($Count3,$s,1).".gif";
$imgStr.="<img src='".$ss."' border='0' hspace='0' />";
}
header("Content-type: application/x-javascript");
print 'document.write("'.$imgStr.'");'; //(注)
?>
(注)シングルコーテーションとダブルコーテーションの位置に注意
◆メモ
※この場合、単純に「print $Count;」と記述してもhtmlファイル上に結果が反映されない。print文に先立ってjavascriptとしてのheaderを送りその後、javascriptを書き出す。
※print文の中味が、javascriptになっていることに注意。(例示ではあえて[ ]と+で結合している。)
※任意の桁数に変換するには、本サイトで「PHP 数値を任意の桁のゼロ付文字に変換する」を参照されたい。
◆メモ2
※imgタグを使う方法が雑誌等で紹介されている。
<img src="http;//〜〜/acclog.php" width="0" height="0" />
のような方法だ。しかしhtmlから起動したとき、headerの返し方がよく判らないので、現在は、上記のようにjavascriptを介在させている次第。どなたか、判っている方がいれば教えて頂ければ幸いです。
(DataID：000041 Date：2008/03/14)
【スクロールバーの色を変える】
◆概要
※スクロールバーの色を変える(CSS及びjavascript)
※IE(インターネットエクスプローラ)独自機能(5.5以降?)
◆Tips
[Stylesheet]---bodyに記述した例
body{
scrollbar-base-color:#ecffff; /*ベースカラー*/
scrollbar-track-color:#ffffff; /*スクロールのない部分 */
scrollbar-face-color:#f0fff0; /*表面*/
scrollbar-darkshadow-color:#8080ff; /*外枠の右と右下の色*/
scrollbar-3dLight-color:#ffffff; /*外枠の左と左上の色*/
scrollbar-shadow-color:#ffffff; /*内側の枠の右と右下の色*/
scrollbar-arrow-color:#ffffff; /*矢印の色*/
}
◆メモ
※テキストエリアの他、overflow 設定したdivタグ等、スクロールバーを使用するタグに設定することができる。
◆サンプル
「スクロールバーの色を変える(javascriptによるカラーリングテスト)」
http://www.dblpar.com/myscript/sample/javascript/scrollbar/scrollbar.html
(DataID：000083 Date：2008/04/02)
【テキストエリアやウィンドウのスクロールバーを表示(消去)する】
◆概要
※CSSを用いて、テキストエリア(textarea)やウィンドウ(body)のスクロールバーを表示する。隠す(消去する)。
※スクロールバー付のボックス(div)を作る。
◆CSS
[stylesheet]
overflow:hidden; //ボックスからはみ出した文字を表示しない
overflow:scroll; //スクロールバーを付けて表示
overflow:visible; //ボックスからはみ出したまま表示
overflow:auto; //ブラウザ設定に従う
◆テキストエリア
[HTML]
※スクロールバーを隠す
<ｔｅｘｔａｒｅａ style="overflow:hidden;"></ｔｅｘｔａｒｅａ>
(注)↑の行ではtextareaを全角文字で記述しています。---MySQLからデータを読み出し文字をデコードした段階での入力トラブル回避。
◆ウィンドウ
[stylesheet]
※スクロールバーを隠す
body{
overflow:hidden;
}
◆スクロールバー付きボックス
[HTML]
※スクロールバーを表示
<div style="height:100px;overflow:scroll"></div>
(注)height(高さ)を指定しないとoverflowは有効にならない。
◆javascriptによる制御の例
function fnScroll(){
document.body.style.overflow="hidden";
}
◆メモ
※テスキトエリアの表示・非表示で
overflowX:hidden //横方向のスクロールバーを隠す
overflowY:hidden //縦方向のスクロールバーを隠す
というのがあったが、IE7.0で試したところうまく動かない。IE6の仕様だったかも知れない。
(DataID：000055 Date：2008/03/21)
【セレクトフィールド(複数選択可能)で選択したデータをサーバーに送る】
◆複数選択可能なセレクトフィールド(コンボボックス)で選択した複数のデータをサーバーに送って処理します。
◆javascript Tips
[XHTML]
//複数選択可能に設定
<form name="FORM" action="<?php echo $PHP_SELF; ?>" method="POST">
...
<select name="cmbSel[]" multiple="multiple">
<option value="1">a001</option>
<option value="2">a003</option>
<option value="3">a003</option>
...
...
</select>
//選択完了ボタン(クリックするとsubmitして同じファイルを再実行)
<input type="submit" value="選択完了" />
...
</form>
【肝】name属性に[]を付加する。
[PHP]
<?php
valCNT=count($cmbSel); //渡された配列の数を取得
$cmbSel=$_POST['cmbSel']; //※(注意)
$n=0;
while ($cmbSel[$n]!=""){
$strDataID_multi=$cmbSel[$n];
....//データを処理
&n=$n+1;
}
?>
◆メモ
※セレクトフィールド name属性に[]を付加する。
※submitされたとき、選択されたセレクトフィールドの要素valueは、「$セレクトフィールドのname属性」(例:$cmbSel)という配列で取得できる。
※配列数はcount($cmbSel)で取得できる。
◆注意
※本来、この行を記述しなくても複数データが取得できるばずだったが、ある日、突然、データが受信できなくなった(2008.04)。原因不明で、試行錯誤してこの行を追加したら、受信できるようになった。どうして?
(DataID：000034 Date：2008/03/06)
【セレクトフィールド(複数選択可能)の選択した要素数をカウントする】
◆複数選択可能なセレクトフィールド(コンボボックス)の選択した要素数をjavascriptでカウントします。
◆Tips
[XHTML]
//複数選択可能に設定(選択する毎にfnSelect()を実行)
<select id="cmbSel" multiple="multiple" onchange="fnSelect()">
<option value="1">a001</option>
<option value="2">a003</option>
<option value="3">a003</option>
...
...
</select>
//選択数表示テキストフィールド
<input type="text" id="txtCount" />
[javascript]
function fnSelect(){
var field=document.getElementById("cmbSel");
var valSelCnt = 0; //様相選択数
// 選択されている個数を取得
for(i=0;i<field.options.length;i++) {
if(field.options[i].selected) {
valSelCnt++;
}
}
document.getElementById("txtCount").value=valSelCnt;
}
◆tips---formを用いる方法
//複数選択可能に設定(選択する毎にfnSelect()を実行)
<form name="FORM">
<select name="cmbSel" multiple="multiple" onchange="fnSelect2()">
<option value="1">a001</option>
<option value="2">a002</option>
<option value="3">a003</option>
....
</select>
//選択数表示テキストフィールド
<input type="text" id="txtCount" />
</form>
[javascript]
function fnSelect2(){
var field=document.FORM.cmbSel;
var valSelCnt = 0; //様相選択数
// 選択されている個数を取得
for(i=0;i<field.options.length;i++){
if(field.options[i].selected) {
valSelCnt++;
}
}
document.getElementById("txtCount").value=valSelCnt;
}
</script>
◆メモ
※セレクトフィールドが選択されているかどうかチェックするとき、選択数を制限するとき等に有効
(DataID：000007 Date：2008/02/28)
【セレクトフィールドにjavascriptの計算結果をバインドする】
◆概要
※例えば1931年から2010年までの80年分をセレクトフィールドから選択できるようにするとき等、すべての年号のタグを記述するのもひとつの方法だが、javascriptで数値計算して、それをセレクトフィールドにバインドして選択できるようにする。
※要素が多く、同一の計算式で求められるときに有効。
◆前提条件
※例示では結果的に下記のタグをjavascriptで記述する。
<select>
<option value="0">--年選択</option>
<option value='2005'>1931</option>
<option value='2006'>1932</option>
<option value='2007'>1933</option>
...
<option value='2007'>1933</option>
</select>
◆西暦年を計算してバインドする
[XHTML]+[javascript]
<select>
<option value='0'>--年選択</option>
<script type="text/javascript">
<!--
var valStart=1931;
var valEnd=2010;
var year;
for(year=valStart;year<=valEnd;year++){
document.write("<option value='"+year+"'>"+year+"</option>\n");
}
//-->
</script>
</select>
◆月を計算してバインドする
[XHTML]+[javascript]
<select>
<option value='0'>--月選択</option>
<script type="text/javascript">
<!--
var valStart=1;
var valEnd=12;
var mon;
for(i=valStart;i<=valEnd;i++){
if(i<10){
mon="0"+i;
}else{
mon=i;
}
document.write("<option value='"+mon+"'>"+mon+"</option>\n");
}
//-->
</script>
</select>
◆メモ
※結果的には同じことであるが、javascriptでwriteした結果はソース表示されないため、かなりすっきりした形になる。
(DataID：000052 Date：2008/03/20)
【セレクトフィールドにテキストファイルのデータをバインドする】
◆概要
※指定したフォルダに保存されたテキスト(txt)ファイルのデータを、セレクトフィールドにバインドして選択できるようにする。
◆前提条件
※テキストファイル(例:data/sample.html)のデータは1行に1データとする(1データづつ改行されている。
[TEXT]
DATA1
DATA2
...
※選択する要素の一番上は「--ファイル選択」と表示する。
◆[XHTML]+[PHP]
<select>
<option value="0">--ファイル選択</option>
<?php
$FilePath="data/sample.txt";
$n=0; //ページ数カウント
//テキストファイルを開く
$fp=fopen($FilePath,"r");
while($data=fgets($fp)){
$data=trim($data); //空白文字除去
if($data!=""){
print '<option value="'.$data.'">'.$data.'</option>\n';
$n=$n+1;
}
}
fclose($fp);
?>
</select>
<input type="text" value="<?php echo $n // 有効ファイル数?>" />
◆メモ
※テキストファイルからデータを一行づつ読み込む。trim関数により前後の空白文字(改行文字等)を除去する。
(DataID：000048 Date：2008/03/19)
【セレクトフィールドにデータベース(MySQL)からSELECTしたデータをバインドする】
◆概要
※MySQLからSELECTしたデータをセレクトフィールドにバインドして選択できるようにする。
◆[MySQL]
※テーブル名:tblSample
※フィールド:FILD1,FILD2,FILD3,...
※WHRER句:FILD1=$strDat1で検索して得られるFILD2のデータをバインドする
◆[XHTML]+[PHP]+[MySQL]
<select>
<option value="0">--ファイル選択</option>
<?phpFILD2
//※データベース設定
require("config.php");
//※SQL接続
$con=mysql_connect(MYSQL_CONNECT_HOST,MYSQL_CONNECT_USER,MYSQL_CONNECT_PASS);
mysql_select_db(MYSQL_DB_NAME);
//※SQL実行
$sql="SELECT FILD2 FROM tblMySample WHERE FILD1='".$strDat1."' ORDER BY FILD2;
$res=mysql_query($sql,$con);
while($row=mysql_fetch_array($res)){
$dd=mb_convert_encoding($row['FILD2'],"SJIS","EUC-JP");
echo "<option value='".$dd."'>".$dd."</option>";
}
//※SQLクローズ
mysql_close($con);
?>
</select>
◆MySQL(config.php)---データベース設定(本文でrequire())
<?php
define("MYSQL_CONNECT_HOST","localhost"); //DBホスト名
define("MYSQL_CONNECT_USER","DBuser"); //DBuser:sample
define("MYSQL_CONNECT_PASS","DBpassword"); //DB password:sample
define("MYSQL_DB_NAME","DBname"); //DB name:sample
?>
◆メモ
※$dd=...は字化けを起こす場合(問題なければ不要)
※上記の例では<option>のvalueと表示されてるTEXTを同じ$ddにしているが、別のデータにすることも可能
(DataID：000047 Date：2008/03/19)
【セレクトフィールドに指定フォルダに保存されたファイル名をバインドする】
◆概要
※指定したフォルダに保存されたファイルのファイル名をセレクトフィールドにバインドして選択できるようにする。
◆前提条件
※サブフォルダ及び特定のファイルは除外する
※選択する要素の一番上は「--ファイル選択」と表示する。
◆[XHTML]+[PHP]
<select>
<option value="0">--ファイル選択</option>
<?php
$FilePath="data/"; //フォルダの相対パス(最後/を付ける)
$List=array("index.html","000000.txt"); //除外ファイルリスト(配列)
$d=dir($FilePath);
while($entry[]=$d->read()){ } //ファイル名取得
sort($entry); //ファイル名並べ替え(分類)
$i_max=count($entry); //取得データ最大値
$n=0; //ページ数カウント
for($i=0;$i<$i_max;$i++){
$Action="1";
if(($entry[$i]=="")||($entry[$i]==".")||($entry[$i]=="..")){
$Action="0";
}else{
//フォルダなら除外(.拡張子のピリオドの有無)
if(strpos($entry[$i],".")==false){
$Action="0";
}else{
//除外ファイルのチェック
if(in_array($entry[$i],$List)){
$Action="0";
}
}
}
//除外されていなければprintする
if($Action=="1"){
print "<option value='".$entry[$i]."'>".$entry[$i]."</option>\n";
$n++;
}
}
?>
</select>
<input type="text" value="<?php echo $n; // 有効ファイル数?>" />
◆メモ
※entry[$i]は、ファイル名の他、空白文字・ピリオド1ケのみ・ピリオド2ケを返すことがある。サーバーの仕様?それらの場合は除外する。
※strpos()は該当する文字がなければfalseを返す(あれば配列内の位置)
※in_array()は該当する値があればtrueを返す(あればfalseを返す)
※詳細はサンプル参照
◆サンプル
「セレクトフィールドに指定フォルダに保存されたファイル名をバインドする」
http://www.dblpar.com/myscript/sample/php/select_dir/select_dir.php
(DataID：000050 Date：2008/03/19)
【チェックボックス(複数)のチェック数をカウントする】
◆数設置されたのチェックボックスのチェックされてる数をjavascriptでカウントします。(どのチェックボックスが選択されているか調べる)
◆Tips(1)---idを用いる方法
[XHTML]
//複数のチェックボックス
<input type="checkbox" id="cbxR_0" />その1<br />
<input type="checkbox" id="cbxR_1" />その2<br />
<input type="checkbox" id="cbxR_2" />その3<br />
<input type="checkbox" id="cbxR_3" />その4<br />
<a href="javascript://" onclick="fnCbxCount()">計算</a>
[javascript]
function fnCbxCount(){
var valCount=0;
var cbxR;
for(i=0;i<=3;i++){
cbxR="cbxR_"+i;
if(document.getElementById(cbxR).checked){
valCount++;
}
}
alert(valCount);
}
※上記の場合は、formタグ及びinputタグのname指定は不要
◆Tips(2)---form/elementsを使う方法
[HTML]
<form name="FORM">
...
<input type="checkbox" name="cbx" />その1<br />
<input type="checkbox" name="cbx" />その2<br />
<input type="checkbox" name="cbx" />その3<br />
<input type="checkbox" name="cbx" />その4<br />
...
<a href="javascript://" onclick="fnCbxCount()">計算</a>
</form>
[javascript]
function fnCbxCount(){
var valCount=0;
var cbxR;
for(i=0;i<=3;i++){
if(document.FORM.elements["cbx"][i].checked){
valCount++;
}
}
alert(valCount);
}
※参考書では FORM.elements[i] が紹介されているが、チェックボックスの前に別のフォームがあるとi=0からではなくフォームの○番目からの指定になる。name指定してFORM.elements["cbx"][i]というように使う方が便利。
(DataID：000024 Date：2008/03/04)
【テーブル(表)の行にマウスカーソルがオンしたらその行の背景色を変える】
◆javascript Tips
[CSS]
//テーブルのスタイルシート
#tblData td{
background-color:#ffffff;
border-color:#c1c1c1; //セルの枠
border-style:solid;
border-width:1px;
cursor:default; //カーソル設定:デフォルト
}
[javascript]
f:背景色を数値で指定
k:表の行(1,2,3,4...)
function MouseOver(f,k){
var k2=parseInt(k)+1; //1行目(項目行--thタグの行)分を加える
switch(f){
case 1:
document.getElementById("tblData").rows[k2].style.backgroundColor="#fff7f7"; //背景:薄いピンク
break;
case 2:
document.getElementById("tblData").rows[k2].style.backgroundColor="#ffffec"; //背景:薄いイエロー
break;
case 3:
document.getElementById("tblData").rows[k2].style.backgroundColor="#ffffff"; //背景:白
break;
}
}
[XHTML]
//テーブル
<table id="tblData">
<tr>
<th>1列目</th>
<th>2列目</th>
<th>3列目</th>
<td>4列目</th>
</tr>
<tr onmouseover="MouseOver_data(1,1)>)" onmouseout="MouseOver_data(3,1)">
<td>a101</td>
<td>a102</td>
<td>a103</td>
<td>a104</td>
</tr>
<tr onmouseover="MouseOver_data(2,2)>)" onmouseout="MouseOver_data(3,2)">
<td>a201</td>
<td>a202</td>
<td>a203</td>
<td>a204</td>
</tr>
<tr onmouseover="MouseOver_data(1,3)>)" onmouseout="MouseOver_data(3,3)">
<td>a301</td>
<td>a302</td>
<td>a303</td>
<td>a304</td>
</tr>
...
...
</select>
◆メモ
※イベントonmouseover/onmouseoutはtrタグに記述。これにより、行のどの列(フィールド)にマウスオーバーしても行の背景色が変わる。
※マウスオーバー時、交互に背景色を#fff7f7と#ffffecに変え、マウスアウト時に元の色(#ffffff)に戻している。
※switch文で色指定番号を増やすことができる。
(DataID：000015 Date：2008/03/03)
【テーブル(表)の列に同じデータがあるかどうかチェックする(javascript)】
◆概要
※テキストフィールドに入力された値が、html上に表示された一覧表(テーブル)の特定の列にあるかどうかチェックする。
※テーブル自体はサーバー側のPHP等で作成されてクライアントに表示されることを想定。値のチェックはクライアント側のjavascriptで実行(サーバーに値を返さない)。
◆Tips
※テキストフィールド(id="txtData")に入力し、「チェック」ボタンをクリック。
※fnCheck()により、テキストフィールドの値がテーブルの「チェック列」にあるかどうかチェックする。
[XHTML]
//入力用テキストフィールド
<input type="text" id="txtData" />
<input type="button" value="チェック" onclick="fnDataCheck()" />
//テーブル
<table id="tblData">
<tr>
<th>チェック列</th>
</tr>
<tr><td id="td_1">abc101</td>
<tr><td id="td_2">abc102</td>
<tr><td id="td_3">abc103</td>
<tr><td id="td_4">abc101</td>
...
</table>
[javascript]
function fnDataCheck(){
//n_max:行数(サーバー側にテーブルを書き出した時に取得しておく)
strData=getElementById("txtData").value;
for(n=1;n<=n_max;n++){
strTd="td_"+n;
strTd=getElementById(strTd).innerText;
if(strTd==strData){
alert(" 同一データがテーブルに存在します。");
return false;
}
}
}
◆メモ
※テーブルがデータベース等を参照して動的に変化する場合等で、サーバーに入力値を返さずクライアント側のみでチェックする時に有効。
※テーブルを出力するとき、セルにtd_1,td_2...という連番のidを記述しておくこと。
(DataID：000061 Date：2008/03/22)
【テーブルを作る(PHPでデータベースMySQLからSELECTしたデータによる)】
◆概要
※MySQLからSELECTしたデータから、テーブルを作成する。
※PHPスクリプトは直接HTMLに書き込めるので、こうした芸当が可能である。このテクの応用範囲は広い。
◆[MySQL]
※テーブル名:tblSample
※フィールド:FILD1,FILD2,FILD3,FILD4
※検索条件:FILD1=$strDat1で検索して得られる全フィールドのデータをFILD1昇順にてテーブルに書き出す。1列目は行番号を記述。
◆[XHTML]+[PHP]+[MySQL]
<table id="tblData" cellpadding="1" cellspacing="1">
<colgroup span="5" width="100" align="center" valign="middle" ></colgroup>
<tr>
<th>No</th>
<th>列1</th>
<th>列2</th>
<th>列3</th>
<th>列4</th>
</tr>
<?php
//※データベース設定
require("config.php");
//※SQL接続
$con=mysql_connect(MYSQL_CONNECT_HOST,MYSQL_CONNECT_USER,MYSQL_CONNECT_PASS);
mysql_select_db(MYSQL_DB_NAME);
//※SQL実行
$sql="SELECT * FROM tblMySample WHERE FILD1='".$strDat1."' ORDER BY FILD1;
$res=mysql_query($sql,$con);
$n=1;
while($row=mysql_fetch_array($res)){
$data1=$row['FILD1'];
$data2=$row['FILD2'];
$data3=$row['FILD3'];
$data4=$row['FILD4'];
?>
<tr>
<td><?php echo $n; ?></td>
<td><?php echo $data1; ?></td>
<td><?php echo $data2; ?></td>
<td><?php echo $data3; ?></td>
<td><?php echo $data4; ?></td>
</tr>
<?php $n=$n+1;
}
mysql_close($con); //SQLクローズ
?>
</table>
◆MySQL(config.php)---データベース設定(本文でrequire())
<?php
define("MYSQL_CONNECT_HOST","localhost"); //DBホスト名
define("MYSQL_CONNECT_USER","DBuser"); //DBuser:sample
define("MYSQL_CONNECT_PASS","DBpassword"); //DB password:sample
define("MYSQL_DB_NAME","DBname"); //DB name:sample
?>
◆メモ
※データが字化けを起こす場合(MySqlとhtmlの文字コードの相違等)、
$data1=mb_convert_encoding($row['FILD1'],"SJIS",auto);
とエンコードする。
(DataID：000062 Date：2008/03/22)
【テーブルを作る(PHPで指定フォルダに保存されたファイル名を書き出す)】
◆概要
※指定したフォルダに保存されたファイルのファイル名をテーブルに書き出す。
◆前提条件
※サブフォルダはない、index.htmlは除外する
※取得するファイルデータ
ファイル名/ファイルサイズ/最終更新日
※1列目は行番号を記述。
◆[XHTML]+[PHP]
<table id="tblData" cellpadding="1" cellspacing="1">
<colgroup span="5" width="100" align="center" valign="middle" ></colgroup>
<tr>
<th>No</th>
<th>ファイル名</th>
<th>タイプ(拡張子)</th>
<th>サイズ(バイト)</th>
<th>最終更新日</th>
</tr>
<?php
$DirPath="data/"; //フォルダの相対パス(最後/を付ける)
$d = dir($DirPath);
$n=1;
while($file_name= $d->read()) {
if(($file_name!=".")&&($file_name!="..")&&($file_name!="index.html")){
$File=$DirPath.$file_name;
if(!is_dir($File)) {
?>
<tr>
<td><?php echo $n; ?></td>
<td><?php echo $file_name; ?></td>
<td><?php echo str_replace(".","",strrchr($file_name,".")); ?></td>
<td><?php echo filesize($File); ?></td>
<td><?php echo date("Y/m/d H:i",filemtime($File)); ?></td>
</tr>
<?php $n=$n+1;
}
}
}
$d->close();
?>
</table>
<br />
<input type="text" value="<?php echo $n-1; // 有効ファイル数 ?>" />
◆メモ
※$file_nameは、ファイル名の他、空白文字・ピリオド1ケのみ・ピリオド2ケを返すことがある。サーバーの仕様?それらの場合は除外する。
※strrchr($file_name,".")); は ファイル名から.以降の文字を取得---拡張子。
※filesize($File); は$Fileのファイルサイズを取得。
※date("Y/m/d H:i",filemtime($File);は$Fileの最終更新日を「年/月/日」形式で取得。
◆サンプル
「テーブルを作る(PHPで指定フォルダに保存されたファイル名を書き出す)」
http://www.dblpar.com/myscript/sample/php/table_dir/table_dir.php
(DataID：000063 Date：2008/03/22)
【テキストフィールドで日本語入力システム(IME)を設定する】
◆テキストフィールドで日本語入力システム(IME)を設定するにはスタイルシートime-modeを用いる
◆HTML
[XHTML]
<input type="text" id="txtField" style="ime-mode:active;" />
◆CSS
[stylesheet]
ime-mode:auto; //IME切り替えは自由(デフォルト)
ime-mode:active; //IME有効(切り替えは自由)
ime-mode:inactive; //IME無効(切り替えは自由)
ime-mode:disabled; //IME無効(半角英数字入力モード)
(DataID：000022 Date：2008/03/04)
【テキストフィールドにURLを入力するときオートコンプリート機能を設定する】
◆概要
※IEでのみ機能する。
※テキストフィールドにオートコンプリートを設定しても、IE6/7のインターネットオプション設定で、「オートコンプリートが有効」になっていなければ機能しない。
◆タグ
[XHTML]
<input type="text" vcard_name="vCard.Email" autocomplete="on" />
※テキストフィールドinputタグに
autocomplete="on"
vcard_name="vCard.Email" //URL対応(他にもあるが省略)
を記述する。
◆オートコンプリートに記憶
※テキストフィールドにURLを入力して[ENTER]を入力。[ENTETR]しないと記憶されないので注意。
◆オートコンプリートから消去
※オートコンプリートから消去するデータにフォーカスして[delete(削除)]キーを選択。
(DataID：000056 Date：2008/03/21)
【htmlを開いたとき、テキストフィールドにあらかじめフォーカスしておく】
◆入力フォームのページ等でページを開いたときにあらかじめ特定のテキストフィールドにフォーカスしておく方法。ファイルオープン時にjavascript を自動実行する。
◆javascript Tips
[XHTML]
<body onload="fnStart()">
...
<input type="text" id="txtField" />
...
</body>
[javascript]
function fnStart(){
fnFocus();
}
function fnFocus(){
document.getElementById("txtField").focus();
}
◆メモ
※データをformタグでpost送信する方法
※PHPの記述 $PHP_SELFは「submitして同一ファイルを再実行」。
(DataID：000021 Date：2008/03/04)
【テキストフィールドにフォーカスしたとき、指定の文字位置にカーソルを移動する】
◆概要
※テキストフィールドの入力をチェックしたとき、不具合があって強制的にテキストフィールドにフォーカスしたとき等、入力している文字の指定の位置(最後尾または先頭等)にカーソルを移動する方法。
※下記の例示では、テキストフィールド(id="txtField")に入力したメールアドレスを、ボタン(id="btnCheck")クリックでチェックしたとき、入力不具合でテキストフィールドにフォーカスを戻す。
◆Tips
[XHTML]
<input type="text" id="txtField" value="" />
<input type="button" id="btnCheck" value="check" onclick="fnMcheck()" />
...
[javascript]
function fnMcheck() {
var n; //カーソルを戻す文字位置(0から始まる)
var h;
if (document.getElementById("txtField").value.indexOf("@",0)<=-1) {
alert(" メールアドレスは****@********(要アットマーク)!!");
with(document.getElementById("txtField")){
focus(); //フォーカスする
h=createTextRange(); //カーソルを最後尾に移動
h.move("character", n); //n+1番目の文字にカーソルを移動
// h.move("character", value.length); //最後尾に
// h.move("character", 0); //先頭に
}
}
}
(DataID：000049 Date：2008/03/19)