<script type="text/javascript">
<!--
function check(){
if(document.loginform.user.value==""){
var element1=document.createElement("span");
element1.innerHTML="Usernameを入力してください。";
element1.className="error0";
var ojbody1=document.getElementById("titlerror1");
ojbody1.appendChild(element1);
false;
}
if(document.loginform.pass.value==""){
var element2=document.createElement("span");
element2.innerHTML="Passwordを入力してください。";
element2.className="error0";
var ojbody2=document.getElementById("titlerror2"); /
ojbody2.appendChild(element2);
false;
}
}
// -->
</script>
<title>ログインページ</title>
</head>
<body>
<div id="error"><font color="red"><?=$error?></font></div>
<div id="loginform">
<form id="loginform" name="loginform" action="index.php" method="post">
<fieldset>
<p>
<div class="titlerror" id="titlerror1">
<label for="user">User Name <span class="hankaku">(半角英数字)</span></label><br />
</div>
<input type="text" name="user" value="" id="user" text-align="middle">
</p>
<p>
<div class="titlerror" id="titlerror2">
<label for="pass">Password <span class="hankaku">(半角英数字)</span></label><br />
</div>
<input type="password" name="pass" value="" id="pass" >
</p>
<div id="submit">
<p class="submit">
<button type="submit" name="login" value="login" class="button" id="login" onclick="check()"><img src="submit.png" border="0" alt="login" /></button>
</p>
</div>
</fieldset>
</form>
</div>
</body>
javascript初心者です。
これを実行するとつくられたタグが一瞬だけ表示して消えてしまいます。(CSSを付けると)
上記は表示すらしません。
どこが間違っているか、なぜそうなのかを教えていただけると助かります。
お願いします。
No.1ベストアンサー
- 回答日時:
<button type="submit" name="login" value="login" class="button" id="login" onclick="check()"><img src="submit.png" border="0" alt="login" /></button>
のonclick="check()"を、onclick="return check();"
にしてみたらどうでしょう。
checkの結果がfalseの時はsubmit(画面遷移)しなくなります。
この回答への補足
何度もsubmitを押すと延々とタグが追加されてしまいます。
もしよろしければ何かいい案はないでしょうか?
location.reload();をコードの一番上に持ってきてもreturn check();を書く前のようになってしまいました。
この場合仕方のないことなんでしょうか?
No.2
- 回答日時:
やっぱり、function check()からも
×false;
○return false;
しないとだめですね。(2箇所)
その上で、
onclick="return check()" です。
※こんな書き方もあるのかと思った。
この回答への補足
<!--
function check(){
var flag = 0;
if(document.loginform.user.value==""){
flag = 1;
var error1 = document.getElementById("error1");
if(error1 == null){
var element1=document.createElement("div");
element1.innerHTML='<span class="error0" id="error1">Usernameを入力してください。</span>';
var ojbody1=document.getElementById("titlerror1");
ojbody1.appendChild(element1);
}
}
if(document.loginform.pass.value==""){
flag = 1;
var error2 = document.getElementById("error2");
if(error2 == null){
var element2=document.createElement("div");
element2.innerHTML='<span class="error0" id="error2">Passwordを入力してください。</span>';
var ojbody2=document.getElementById("titlerror2");
ojbody2.appendChild(element2);
}
}
if(flag == 0){
return true;
}else{
return false;
}
}
// -->
</script>
書くところがなかったのでここに失礼します。
上記で理想の動きになりました!!
どうもありがとうございました!!
おおおおおおおお!
出来ました!2カ所でreturn false;すると片方がfalseの場合そこで止まってしまったので
<script type="text/javascript">
<!--
function check(){
var flag = 0;
if(document.loginform.user.value==""){
flag = 1;
var element1=document.createElement("span");
element1.innerHTML="Usernameを入力してください。";
element1.className="error0";
var ojbody1=document.getElementById("titlerror1");
ojbody1.appendChild(element1);
}
if(document.loginform.pass.value==""){
flag = 1;
var element2=document.createElement("span");
element2.innerHTML="Passwordを入力してください。";
element2.className="error0";
var ojbody2=document.getElementById("titlerror2");
ojbody2.appendChild(element2);
return false;
}
if(flag == 0){
return true;
}else{
return false;
}
}
// -->
</script>
にしたらできました!
どうもありがとうございます!
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript ①入力フォーム→②確認表示画面→③送信完了画面のコードを書いているのです、 入力フォームから受け取っ 2 2022/05/10 16:45
- HTML・CSS CSSが効かずどのように指定すれば良いか分からないのでアドバイスお願い致します 2 2023/06/07 12:25
- JavaScript jqueryを使ったスムーススクロールのコードを書いたのですが、HTMLコード内にある、a butt 2 2022/04/14 10:59
- JavaScript 入力フォームの javascript で メールアドレスの正規チェックをを行い、ボタンをクリックして 2 2022/04/27 16:06
- JavaScript clear機能を失わずにファイルアップロード機能を作成したい 3 2023/06/10 16:12
- HTML・CSS ボタンをクリックした時に、入力フォームのすぐ下部に、「入力欄が空白です」というテキストメッセージが表 1 2022/04/27 16:25
- HTML・CSS CSS のみのタブ切り替えについて 1 2023/01/11 16:47
- JavaScript Javascriptが機能せず原因が分からないので教えて頂きたいです 3 2023/06/04 14:50
- JavaScript フォームが空欄の時にフォームの外をクリックすると、エラーが出るコードを調べています。 1 2023/06/25 11:51
- JavaScript javascriptで移動ボタンを押した際に遷移するボタンを追記したい 1 2022/11/29 03:02
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
MAX関数を使ってからLEFT JOIN...
-
前回の質問の続き
-
createElementで作成した要素を...
-
removeEventListenerについて
-
読み込んだQRコードをフォーム...
-
取得した要素がインライン要素...
-
classの中の<a>タグにidを追加
-
jQueryで特定id以外の下にある...
-
背景色を透明化
-
複数のリンク画像を一定時間で...
-
クリックするとテーブルの列の...
-
jQueryで同じid属性が複数あっ...
-
プルダウンとチェックボックス...
-
getElementsByClassName使い方
-
JavaScriptでテキストを表示・...
-
onclickを使わずにクリック元を...
-
一部のjavascriptがfirefoxで効...
-
textareaに画像を表示したい
-
Javascriptで画像を水面のよう...
-
JavaScriptで変更した属性の元...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
MAX関数を使ってからLEFT JOIN...
-
javascriptテキストBOX色を元に...
-
createElementで作成した要素を...
-
読み込んだQRコードをフォーム...
-
console.log結果をhtmlで表示し...
-
iframe内のリンクが飛ばないの...
-
変数内容をHTML内で表示する方法
-
getElementByIdの戻り値がnull...
-
背景色を透明化
-
自働生成される<div>タグに連番...
-
複数のリンク画像を一定時間で...
-
クリックで色変更後に既に変更...
-
removeEventListenerについて
-
IFRAMEの表示/非表示を切り替え...
-
表示・非表示のスクリプトで、...
-
タブで開いてさらにタブ内をア...
-
Jquery 親要素で順番入れ替え
-
HTML id名とjavascript変数名
-
VBScriptでXMLのデータを取得す...
-
[急ぎ] videoタグで埋め込んだm...
おすすめ情報