なぜカスタムエラーダイアログボックスが消えていくのですか？

Question

カスタムエラーダイアログボックスを作成したいのですが、これは私が使用したコードですが、実行するたびに消えてしまいます。このコードで問題を見つけることができません。

HTML：

<form name="signup" action="" onSubmit="return Validation_for_SignUp" method="post"> 
    <h2 id = "FormTitle"> New Member? Sign up first! </h2> 
    <label>Username</label> 
    <input type="text" name="username" id="name"/> 
    <label>Email</label> 
    <input type="text" name="email" id="email"/> 
    <label>Password</label> 
    <input type="password" name="password" id="password"/>     
    <label>Confirm Password</label>     
    <input type="password" name="cpassword" id="cpassword"/>      
    <button id="Register"onclick="Error.render('Please check the field')"> Sign Up </button>    
</form> 

はJavaScript：

<script> 
    function CustomError() 
    { 
    this.render = function (dialog) 
    { 
     var WinWidth = window.innerWidth; 
     var WinHeight = window.innerHeight; 
     var ErrorDialog = document.getElementById('ErrorDialog'); 
     var ErrorDialogBox = document.getElementById('ErrorDialogBox'); 
     ErrorDialog.style.display = "block"; 
     ErrorDialog.style.height = WinHeight + "px"; 
     ErrorDialogBox.style.left = (WinWidth/2) - (550 * .05) + "px"; 
     ErrorDialogBox.style.top = "100px"; 
     ErrorDialogBox.style.display = "block"; 
     document.getElementById ('DialogHead').innerHTML = "Warning!"; 
     document.getElementById ('DialogBody').innerHTML = dialog; 
     ddocument.getElementById ('DialogFoot').innerHTML = '<button onclick = "Error.ok()"> OK </button>'; 
     } 
     this.ok = function() 
     { 
     document.getElementById('ErrorDialogBox').style.display = "none"; 
     document.getElementById("ErrorDialog").style.display = "none" 
     } 
    } 
    var Error = new CustomError(); 
</script> 

CSS：

#ErrorDialog 
{ 
    display: none; 
    opacity: .8; 
    position: fixed; 
    top: 0px; 
    left: 0px; 
    background: black; 
    width: 100%; 
    z-index: 10; 
} 
#ErrorDialogBox 
{ 
display: none; 
position: fixed; 
background: white; 
border-radius: 7px; 
width: 550px; 
z-index: 10; 
} 
#DialogHead 
{ 
background: #666; 
font-size: 19px; 
padding: 10px; 
color: #CCC; 
} 
#DialogBody 
{ 
background: #333; 
padding: 20px; 
color: #FFF; 
} 
#DialogFoot 
{ 
background: #666; 
padding: 20px; 
color: #FFF; 
} 

Answer 1

こんにちは@wang・ヒラ_轟轟サインアップすることを除いて、あなたのコードに問題はありませんボタンは最終的にページをリロードするフォームをポストする、これはあなたのダイアログがすぐに消え去る理由、そしてveriへ私はあなたのError.render（）を実行しようとしています。以下のようなコンソールから、または多分フォーム外の別のボタンから関数：このボタンをクリックする

<a href="javascript:Error.render('Please check the field')">TEST IT</a>

は、ダイアログボックスが表示されます、それは多分あなたが行う方法であなたのコードを変更しようとすることができますので、消えるません。 immediatlyに提出するのではなく、エラーが見つからない場合。

私はこれがあなたの質問に答えることを願っています。