javascriptの簡易パスワード認証について

このQ&Aのポイント
  • javascriptを使用したパスワード認証の方法について説明します。
  • ユーザが入力したパスワードをチェックし、半角英数字以外の文字が含まれていないかを確認します。
  • パスワード入力後に生成されるダイアログボックスのデザインを改良し、画面中央に表示させる方法についての解決策を探しています。
回答を見る
  • ベストアンサー

javascriptの簡易パスワード認証について

javascriptでのパスワード簡易認証で、 次のようなスクリプトをネットからコピペしてホームページに使用しようとしました。 <script type="text/javascript"> function gate(){ // ▼ユーザの入力を求める var UserInput = prompt("パスワードを入力して下さい:",""); // ▼入力内容をチェック if( /W+/g.test(UserInput) ) { // ▼半角英数字以外の文字が存在したらエラー alert("半角英数字のみを入力して下さい。"); } // ▼キャンセルをチェック else if( UserInput != null ) { // ▼入力内容からファイル名を生成して移動 location.href = UserInput + ".html"; } } </script> しかし、上記のようにすると、パスを入力後に生成されるダイアログはデザインが質素で、がっかりしています。 「ぱすワードを入力してください」のダイアログボックスのデザインを良くするには、上記のプログラムをどう修正すればよいでしょうか?  そして、このダイアログは何故か、画面上部に表示されてしまいます。画面中央に表示するには、上記のjavascriptをどうすればよいでしょうか? せめて、「javascrptで可能か否か」だけでも教えていただければ幸いです。

noname#222284
noname#222284

質問者が選んだベストアンサー

  • ベストアンサー
  • celtis
  • ベストアンサー率70% (2271/3210)
回答No.2

ダイアログボックスのデザインを変更するならSweetAlertがお薦めです。 下記サイトにわかりやすいデモページがあるので参考にしてください。 http://co.bsnws.net/article/1

noname#222284
質問者

お礼

こんにちは、ご回答有難うございます。 sweetalert、まさかこのような便利な、美しいものがあるとは驚いています。 まさに、当方が探し求めていたものです。 しかもこれ、画像を表示させることもできるようですね。 探し求めていた貴重な情報を戴き、本当にうれしいです! ご丁寧にリンクまでお張りいただき、誠にありがとうございました。

その他の回答 (1)

  • wormhole
  • ベストアンサー率28% (1621/5657)
回答No.1

そのダイアログはブラウザが出しているものなのでブラウザが変われば変わります。 位置指定などはできなかったと思います。 デザインや位置を指定したいのでしたらjavascriptのprompt関数は使わないで、htmlで入力用のフォームを作って行うことになるかと思います。

noname#222284
質問者

お礼

早速のご回答、誠にありがとうございます。 非常に勉強になっております。 なるほど、そういう手があるんですね。

関連するQ&A

  • パスワード認証付きのページ

    簡単なパスワード認証付きのページを作成しています。 入力したパスワードが隠し文字の「*」で表示されず、普通に表示されてしまいます。 どのようにしたらよいでしょうか? 教えてください。 ======================================== <script language="JavaScript"> <!--// function Password() { pw = prompt("パスワードを入力してください:","") if(pw) { location = pw + ".html" } else { alert("パスワードが間違っています") } } //--> </script>

  • CGIを利用せずにウェブサイトにパスワードチェックをかける方法

    契約プロバイダーが指定のCGI利用しか認めていま せん。 CGIを利用せずにウェブサイトにパスワードチェック をかける方法があれば教えてください。 なお、javaでパスワードチェックをかける方法が雑誌に 紹介されていましたが、チェック後に表示されたページ に直接アクセス可能という中途半端なしろものでした。 これでは意味がないですよね。 ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ <HTML><HEAD><META name="robots" content="noindex,nofollow"> <SCRIPT LANGUAGE="JavaScript"> function nameCheck() { var msgPrompt =パスワードを入力してください。 var msgTitle = "Please password here."; var msgWelcome = "WELCOME"; var msgBad = "正しいパスワードを入力してください"; var passWord = "passpass"; var goodLogon = "xxxxxxx.html"; var badLogon = "badpage.html"; var userInput; userInput = prompt(msgPrompt,msgTitle); if(userInput == passWord) { alert(msgWelcome); window.location.href = goodLogon; }else{ alert(msgBad); window.location.href = badLogon; } } nameCheck(); </SCRIPT> <TITLE></TITLE> </HEAD> <BODY onload="nameCheck()"> </BODY> </HTML>

  • ホームページとパスワード

    パスワードについて、00-12-28 mori0393様のご回答を使わせて頂いております。ソースコードは以下のとおりです。 <SCRIPT Language="JavaScript"> <!-- function passw(){ if(prompt("パスワードを入力してください","")=="?????"){ alert("ようこそ!"); } else{ alert("見ないで!");history.go() } } document.writeln(passw()) <!-- --> </SCRIPT> ここでは、?????がパスワードになりますが、このパスワードのソースコードをホームページのトップページに置いて使った場合、まず最初にパスワードを入力してトップページを開き、Webサイトに入ります。 しかし再度トップページのリンク文字をクリックした場合 、又パスワードを要求してきます。 1度入力すれば、そのあとはパスワードなしでトップページに入る方法はないものでしょうか? どなたかご存知の方、教えて下さい。 よろしくお願いします。

  • パスワード制限スクリプト。ウィンドウを閉じるスクリプトについて

    WEBページにパスワード制限をかけたいと思います。 今回JavaScriptなので、めちゃめちゃ強固なものではありませんが。 下のようなスクリプトを用意しました。 ------------------------ pass = prompt("パスワードを入力して下さい",""); if(pass != "XXXXX") { parent.top.window.close(); } ------------------------ これでも動くのですが、 パスワードが不正なとき、画面を閉じようとする設計です。 ただし、その時IEだと、 「画面を閉じようとしています」と聞かれ、 「はい」「いいえ」の選択肢がでます。 「はい」・・・もちろん閉じます。 「いいえ」・・画面そのまま残ります。 これじゃ意味ないんです。 「いいえ」を選んでもとにかく閉じさせる方法が必要なんです。 「いいえ」を選択しても、繰り返し繰り返し「閉じようとしています」と聞かれるような。 なにかいいスクリプトはないでしょうか?

  • javascriptの勉強中です。

    javascriptの勉強中です。 下記の内容を組みたいと考えています。 1) クリックしてダイアログボックスを開きます。 2) ダイアログボックスで名前を入力してもらいます。 3) その入力してもらった名前をあらかじめ決めていた場所に表示させます。 // htmlヘッダ内 <script> function user() { window.prompt ('名前を入力してください',''); } </script> // htmlボディ内 <a onclick="user()">ここをクリックして名前を入力してください。</a> <br> <script> document.write('ここに名前を表示させたい' + 'さん'); </script> 入力ありがとうございます。 ボディ内の'ここに名前を表示させたい'の欄に入力した名前を表示させたいです。 名前を格納して色々な場所で使用したいんです。 色々なサイトを見て、こちらの決めた変数を格納することはわかるのですが、ユーザーが入力した内容を格納する方法を教えていただきたいです。 ヒントでも参考サイトでも結構なので、教えていただけたら幸いです。 何卒よろしくお願いします。

  • promptを使用した年齢認証

    javascriptを勉強し始めたばかりで参考書のとおりに打っているのですが、疑問が解決しなくて困っています。 以下のようなif else文があったとすると、コマンドにちゃんと数字を入力してくれたらそれで判定ができるんですが、数字ではなくて文字を入力されてしまっても通ることがわかり、何とか解決できないかと悪戦苦闘しています。 javaのことがよくわからなくて、本当にすみませんが、よろしくお願いします。 <script type="text/javascript"> var nenrei; nenrei=parseInt(prompt("年齢を入力してください。")); if(nenrei<18){ document.write("18禁です。"); } else{ document.write("入場できます。"); } </script>

  • javascriptに関する質問です

    <html> <head> <title>javascript BMIを求める</title> </head> <body> <h2>BMI を求める</h2> <SCRIPT TYPE="text/JavaScript"> // JavaScript var weight, height, bmi; weight = prompt("60[kg] "); height = prompt(' 175[cm] '); height = height/100; bmi = weight/(height * height); document.write('BMI は', bmi); // JavaScript </script> </body> </html> をif文かfor文を使いBMIを計算したいです、どのようにすればいいのかご教授ください

  • javascriptでの正規表現について

    javascript正規表現にて正の整数および小数(半角のみ) を判別したいのですがうまくいきません。どうすればいいのでしょうか。<script language=javascript> function StrCheck(strSrc){ var value = strSrc.value; if (value.match(/[0-999]+¥.[0-99]/)==true){ alert("半角数字のみで入力して下さい"); } </script> ); 以上のようにつくってみましたが、半角でも全角でも「半角を入力してください」というメッセージがでてしまいます。これを全角のみでエラー表示がでるようにしたいのですがどうしたらよいのでしょうか。参考になるWEBページでもあれば教えてください。ご教授の程よろしくお願い申し上げます。

  • ▲▲JavaScriptに詳しい人見てください▲▲

    入力された複数の (不定個の) 数値の合計を求めるプログラム . 空の入力でデータ入力の終了を表すものとする (少なくとも1個はデータを入力するものとする). をつくる課題が出ているのですが、 なかなか上手く行きません。 1: 2: <title>JavaScript Sample 4-2</title> 3: <script type="text/javascript"> 4: <!-- 5: // 変数の宣言 6: var i, x; 7: 8: // 入力・計算 9: x = Number(prompt("?")); 10: i = prompt("?"); 11: while (x != "") { 12: for(i = 1; i <= Number(x); i++){ 13: i +=Number(prompt( i + "つ目の数字を入力してください")); 14: } 15: } 16: 17: // 出力 18: document.writeln("<p>合計は " + x + " です.</p>"); 19: 20: // --> 21: </script> というのを1番始めに打ったのですが、 意味不明なことになってしまうことに気付いて 9~15行目の部分を,書きなおすと x = Number(prompt("?")); i = prompt("?"); while (x != "") { i +=Number(prompt("数値を入力してください")); } としましたが,これだと無限ループから抜けられませんし… かなりめちゃくちゃなことをしていることは分かるのですが どこをどう直せばいいかわからないレベルなんです。 ご教授いただければ幸いですっ

  • JAVAで作るパスワード制ホームページの作り方

    以前JAVAを使った簡単なパスワード制のHPを作りました。 ですが、どこのサイトから下記のタグを持ってきたのか 自分で忘れてしまって・・・^^; ソースを見てパスワードがバレバレになりすぎないように 一工夫したのは覚えているのですが、 作成したのがかなり前のことだったので、パスワードの文字を示す65%とか26%が、 それぞれどの文字に対応するのかが自分でわからなくなってしまいました^^; ↓これが以前私がどこかから持ってきたタグです。 <html> <head> <title>タイトル</title> <SCRIPT language="JavaScript"> <!-- //パスワードのチェック関数 function enter(){ myPwd = prompt("パスワードを入れてね♪",""); if(myPwd == unescape("%6D%65%61%74%26%62%65%65%72")){ location.href = "***.html"; } else if(myPwd == null){ } else{ alert("パスワードが間違っています。"); enter(); } } //--> </SCRIPT> </head> <BODY onLoad="enter()"> HP作成に詳しい方いらっしゃいましたら、65%などがどのような意味を持つのか、 また、対応表などが書かれているURLなどを教えて頂けると助かります。 宜しくお願いします。

    • ベストアンサー
    • HTML

専門家に質問してみよう