スモールビジネスのIT日誌

• (2012-04-01 06:16:41)

htmlは使うが、javascriptまではなかなか手が出ない。しかし、少し知っているだけで、かなり便利。機会あるときはいやがらずに「少しだけ」勉強したい。

文字数カウンター

(2012/04/01)

文字数をリアルタイムにカウントするには、lengthプロパティでOK。

onkeyupというイベントハンドラでリアルタイムに、独自作成の関数ShowLengthを起動し

入力文字列の文字数を数えて、リアルタイムにidで指定された要素に挿入するJavascript。

<script type="text/javascript">

<!--

function ShowLength( str ) {

document.getElementById("inputlength").innerHTML = str.length;

}

// -->

</script>

<textarea name="作品" rows="12" cols="80" onkeyup="ShowLength(value);"></textarea>

(※文字数：<span id="inputlength">現在 0</span> 文字)

※参考URL：

http://www.nishishi.com/javascript/2007/input-counter.html

---

ログインをjavascriｐtで制御

(2012/02/22)

formは、通常「submit」で送信するが、入力文字のチェックや制御をするために、Javascriptが使えることがわかった。ロリポップのログイン画面から勉強。

・通常のsubmit：

＜input type="submit" value="送信" /＞

・ロリポップ：(floginという関数を、0をパラメーターにつけて起動。0はドメインの種類)

＜a href="javascript:flogin(0);"＞ログイン＜/a＞

-------------------------------

＜script type=text/javascript＞

＜!--

function flogin(pno){

//「1」独自ドメインか「0」ロリポップドメインで入力フォーマットのチェック

if (pno!=1){

if(document.frm.account.value == ""){ alert("入力されていません"); document.frm.account.focus(); return; }

}else{

if(document.frm.account2.value == ""){ alert("入力されていません"); document.frm.account2.focus(); return; }

}

//パスワードフォーマットのチェック

if(document.frm.passwd.value.length ＞ 30 || document.frm.passwd.value.length ＜ 0){ alert("文字数不正です"); document.frm.passwd.focus(); return;

if(document.frm.passwd.value.match(/[^0-9a-za-z_\-=.@!]/)){ alert("パスワードに不正な文字が含まれています"); document.frm.passwd.focus(); return; }

//クッキーの有無によるアクション方法の設定

if(document.cookie != "") document.frm.action="https://user.lolipop.jp/?mode=login&exec=1";

else document.frm.action="https://user.lolipop.jp/?mode=login&exec=2";

//送信

document.frm.submit();

}

//--＞

＜/script＞

＜/head＞

＜body onload="document.frm.passwd.focus();"＞ ＜!-- フォーカスをパスワードフィールドに --＞

＜form name="frm" method=post＞

＜input value="xxxxxx" name="account"＞

＜input type="password" name="passwd"＞

＜a href="javascript:flogin(0);"＞ログイン＜/a＞

＜/form＞

-------------------------------