WEB 正しく入力されていたらチェックマークが表示される仕組み

質問

こんにちは、WEBの勉強をしています。
あるサイトでwebのアンケートを記入していて、正しく入力されていたらチェックマークが表示される仕組みになっていました。
例えばメールアドレスを記入するところで最初「アドレスを入力してください」とあり、@以降を入力すると「OK」マークが表示されるという具合です。
これってどういう仕組みを使っているのでしょうか？
何かお分かりの方がいましたら教えてください。よろしくお願いします。

回答No.2

leap_day · ベストアンサー

こんにちは

@が入力されれば表示・・・というのであれば
<style type="text/css"><!--
#ma { width:200px; }
#ok { display:none; }
--></style>
<script type="text/javascript"><!--
var macheck;
function mac() {
obj = document.getElementById("ma").value;
image = document.getElementById("ok");
check = /@/;
if(!obj.match(check)) { image.style.display = "none"; macheck=0;}
if(macheck == 1) { return false; }
if(obj.match(check)) { image.style.display = "inline"; macheck=1;}
}
//--></script>
<div>
<input type="text" onkeyup="mac()" id="ma" value="アドレスを入力してください">
<span id="ok">O.K.</span>
</div>

こんな感じでできると思います

**@**.**.**　のようなメールの形で・・・であれば
check = /.+@.+\..+\..+/;
に変更すればできると思います

他にもサンプルが見たいのであれば『メール』『アドレス』『チェック』『javascript』などを組み合わせて検索すれば色々出てくると思います

お礼

leap_dayさん、返信ありがとうございます。
具体的なサンプルを教えていただいたおかげで大分理解が進みました。

回答No.1

yambejp

>正しく入力

の意図がわかりかねます。
単に、ある入力フォームに入力がされればチェックボックスにチェックが
つく程度であれば、非常にかんたんなスクリプトですみます。
逆に「正しく」が「実際に存在するアドレス」となると極端に複雑になります。
どこまで正確性を重視するかによってまったくアプローチが
ことなりますので、一概に回答は難しいと思います

お礼

yambejpさん、返信ありがとうございます。
＞「実際に存在するアドレス」となると極端に複雑になります。
その通りですね。
自分の抜けていた考えに接することができました。
ありがとうございます。