私は最近、&JavascriptのHTMLに取り掛かり始めました。両方とも非常に魅力的な言語だと思います。私はしかし、私は私の旅で、私が解決することはできませんエラーが発生しました。JSハンドラのボタンはフォームを送信しません
基本的に私はログインフォームを作成しようとしていますが、提出することはできません。
ボタン(login.htmlと):
<script src="../js/login.js"></script>
のJavaScript(login.js):
<button id="submit" type="button" onclick="verifyLogin()" class="btn btn-primary btn-lg btn-block">Login</button>
は、JSスクリプト(login.htmlと)を含める
$(function() {
var $formLogin = $('#login-form');
var $formLost = $('#lost-form');
var $formRegister = $('#register-form');
var $divForms = $('#div-forms');
var $modalAnimateTime = 300;
var $msgAnimateTime = 150;
var $msgShowTime = 2000;
$("form").submit(function() {
switch(this.id) {
case "login-form":
var $lg_username=$('#login_username').val();
var $lg_password=$('#login_password').val();
if ($lg_username == "ERROR") {
msgChange($('#div-login-msg'), $('#icon-login-msg'), $('#text-login-msg'), "error", "glyphicon-remove", "Login error");
} else {
msgChange($('#div-login-msg'), $('#icon-login-msg'), $('#text-login-msg'), "success", "glyphicon-ok", "Login OK");
}
return false;
break;
case "lost-form":
var $ls_email=$('#lost_email').val();
if ($ls_email == "ERROR") {
msgChange($('#div-lost-msg'), $('#icon-lost-msg'), $('#text-lost-msg'), "error", "glyphicon-remove", "Send error");
} else {
msgChange($('#div-lost-msg'), $('#icon-lost-msg'), $('#text-lost-msg'), "success", "glyphicon-ok", "Send OK");
}
return false;
break;
case "register-form":
var $rg_username=$('#register_username').val();
var $rg_email=$('#register_email').val();
var $rg_password=$('#register_password').val();
if ($rg_username == "ERROR") {
msgChange($('#div-register-msg'), $('#icon-register-msg'), $('#text-register-msg'), "error", "glyphicon-remove", "Register error");
} else {
msgChange($('#div-register-msg'), $('#icon-register-msg'), $('#text-register-msg'), "success", "glyphicon-ok", "Register OK");
}
return false;
break;
default:
return false;
}
return false;
});
$('#login_register_btn').click(function() { modalAnimate($formLogin, $formRegister) });
$('#register_login_btn').click(function() { modalAnimate($formRegister, $formLogin); });
$('#login_lost_btn').click(function() { modalAnimate($formLogin, $formLost); });
$('#lost_login_btn').click(function() { modalAnimate($formLost, $formLogin); });
$('#lost_register_btn').click(function() { modalAnimate($formLost, $formRegister); });
$('#register_lost_btn').click(function() { modalAnimate($formRegister, $formLost); });
function verifyLogin($email, $password){
if($email === "admin" && $password === "1234"){
alert("Login succesful");
} else {
alert("Could not login");
}
}
function modalAnimate ($oldForm, $newForm) {
var $oldH = $oldForm.height();
var $newH = $newForm.height();
$divForms.css("height",$oldH);
$oldForm.fadeToggle($modalAnimateTime, function(){
$divForms.animate({height: $newH}, $modalAnimateTime, function(){
$newForm.fadeToggle($modalAnimateTime);
});
});
}
function msgFade ($msgId, $msgText) {
$msgId.fadeOut($msgAnimateTime, function() {
$(this).text($msgText).fadeIn($msgAnimateTime);
});
}
function msgChange($divTag, $iconTag, $textTag, $divClass, $iconClass, $msgText) {
var $msgOld = $divTag.text();
msgFade($textTag, $msgText);
$divTag.addClass($divClass);
$iconTag.removeClass("glyphicon-chevron-right");
$iconTag.addClass($iconClass + " " + $divClass);
setTimeout(function() {
msgFade($textTag, $msgOld);
$divTag.removeClass($divClass);
$iconTag.addClass("glyphicon-chevron-right");
$iconTag.removeClass($iconClass + " " + $divClass);
}, $msgShowTime);
}
});
私は」関数が現時点では何もしないことを認識しています。私は何が間違っているのか分かりません。
よろしく、
お読みくださいは、[尋ねます]。質問の最も重要な部分の1つはタイトルであり、あなたの質問はあなたの質問の内容については何も言いません。 –
エラーは何ですか? あなたのコードを視覚的に調べると、私が見ることができる問題は、verifyLoginが2つのパラメータをとり、(onclick経由で)それを呼び出すときに、nonLoginを渡していることです。 – Alan
@ NicolaiArpeタイトルは閉じなければならないもののように見えたので、この質問を開いたが、本文にはタイトルよりもずっと多くの情報がある。編集が間違っている(または好きではない)場合は、自由にロールバックしたり変更を加えることができますが、より良いタイトルを使用してください。 – ssube