BreathTake/ホームページ作成の小技・JAVA篇

*
ホームページ作成の小技タイトル・JAVA篇・イメージ写真
JAVA-その他のポイント

JAVAスクリプト 豆知識


ブラウザの戻るを禁止する


戻りたくない画面に
<script>
history.forward();
</script> を記述しておく

フォーム入力の最大文字数を設定する


<form name="form">
<textarea name="POST_plandetails" cols="40" rows="10" class="zenkaku" wrap="physical" onKeyup="
  o=document.getElementById('slen');
  n=this.value.replace(/\s| /gm,'').length;
  o.value=n;
  o.innerHTML=n;
  o.style.color=(n>240)?'red':'tan';
  document.getElementById('mes').innerHTML=(n>240)?'文字 文字制限を越えました':'文字';
  document.getElementById('mes2').innerHTML=(n>240)?'':' あと'+(240-n)+'文字';
">
<?= $POST_contents ?>
</textarea>
<br />
最大文字数240字まで : 現在<span id="slen"></span><span id="mes">字</span><span id="mes2"></span>
</form>

お気に入りに登録


<input type="button" onclick="window.external.AddFavorite(‘ポータルサイトのURL','ポータルサイトの名前')" value="お気に入りに登録する">

スクリーンサイズで指定ページへジャンプ


<script type="text/javascript">
var jumpto = [
   [1600,1200,'./a.html'],
   [1280,1024,'./b.html'],
   [1024,768,'./c.html'],
   [800,600,'./d.html']
] ;
var defaulturl = './e.html' ; // 上記以下の場合
sw = screen.width ; sh = screen.height ;
newurl = defaulturl ;
for (var i = 0; i < jumpto.length; ++i) {
   if (jumpto[i][0] >= sw && jumpto[i][1] >= sh) newurl = jumpto[i][2] ;
}
window.open(newurl, 'ウィンドウ名', 'fullscreen=1') ;
</script>
<script language="JavaScript"><!--
w = screen.availWidth;
h = screen.availHeight;
alert(w+","+h);
// --></script>

別ウィンドウをサイズ固定で開く


<a href="#" onclick="window.open('○○.html','_blank','width=横幅,height=縦幅,resize=no')">リンクテキストor画像</a>
<a href="#" onclick="window.open('example.html', 'mywindow5', 'width=400, height=300, menubar=no, toolbar=no, scrollbars=yes');">テスト5</a>
<a href="javascript:void(window.open('example.html', 'mywindow3', 'width=400, height=300, menubar=no, toolbar=no, scrollbars=yes'));">テスト3</a>
<a href="#" onclick="window.open('photo_up.php?store_id=<?=$store_id?>', '_blank', 'width=600, height=600, menubar=no, toolbar=no, scrollbars=yes');">写真の挿入</a>

戻るボタン等


@ひとつ戻る
<form>
<input type="button" VALUE="戻る" onClick="history.back()">
</form>
Aひとつ進む <form>
<input type="button" VALUE="進む" onClick="history.forward()">
</form>
B2つ戻る <form>
<input type="button" VALUE="2つ戻る" onClick="history.go(-2)">
</form>
C2つ進む <form>
<input type="button" VALUE="2つ進む" onClick="history.go(2)">
</form>
D確認メッセージの表示
<form>
<input type="submit" name="delete" value=" 削除 " onclick="javascript:return confirm('削除しても宜しいですか?');">
</form>

Eフォームを閉じる
<form>
<input type="submit" name="close" value="閉じる" onClick="javascript:self.close();">
</form>

Fひとつ前に戻る
<a href="javascript:history.back()">&gt;&gt;戻る</a>

セレクトで再表示


//セレクトタブの内容が変更されると、onChangeイベントが発生
//on_changeイベント用のJavaScript
$on_change = "onChange =\" MyForm.submit();\"";
<form action="<?=$_SERVER["PHP_SELF"]?>" method = "post" name ="MyForm">;
 #セレクトタブにイベントを書くと、そのJavaScriptを実行する
 <select name = 名前 <?php ${on_change} ?> >
   <option value = ""></option>
   <option value = ""></option>
   <option value = ""></option>
 </select>
</form>

セレクトボックスの更新で別の所に値を代入する


//on_changeイベント用のJavaScript
$on_change = "onChange =\" MyForm.submit();\"";
<input type="text" name="POST_name" value="<?=$_POST["POST_name"]?>" size = "24">
<select name = sexyito <?= ${on_change} ?>>
  <option>--選択してください--</option>
  <OPTGROUP label="A">
    <option value = "Aおもて01">Aおもて01</option>
    <option value = "Aおもて02">Aおもて02</option>
    <option value = "Aおもて03">Aおもて03</option>
    <option value = "Aおもて04">Aおもて04</option>
  </OPTGROUP>
  <OPTGROUP label="B">
    <option value = "Bおもて01">Bおもて01</option>
    <option value = "Bおもて02">Bおもて02</option>
    <option value = "Bおもて03">Bおもて03</option>
    <option value = "Bおもて04">Bおもて04</option>
  </OPTGROUP>
  <OPTGROUP label="C">
    <option value = "Cおもて01">Cおもて01</option>
    <option value = "Cおもて02">Cおもて02</option>
    <option value = "Cおもて03">Cおもて03</option>
    <option value = "Cおもて04">Cおもて04</option>
  </OPTGROUP>
</select>
Copyright © 2011 BreathTake All Rights Reserved