lightBox를 통한 로그인 양식

필자는 라이트 박스보기를 표시하는 가장 간단한 CSS를 사용했습니다. 내가 사용하는 코드는 여기에서 불필요한 CSS 속성을 제거한된다lightBox를 통한 로그인 양식

<style> 
     .black_overlay{ 
      display: block; 

     } 
     .white_content { 
      display: block; 

     } 
    </style>

HTML을 양식

<div id="light" class="white_content">  
     <input id="name" name="name" type="text" /> 

     <input id="password" name="password" type="password" /> 
     <input type="submit" name="submit" value="Sign In" onclick="check(this.form)"/> 

     </div> 

     <div id="fade" class="black_overlay"></div>

그리고 자바 스크립트 함수를 들어, 필드가 올바른지 확인합니다

function check(form)/*function to check userid & password*/ 
{ 

var name= $("#name"); 
var pass=$("#password"); 
if(name== "admin" && pass == "admin") 
    { 
    document.getElementById('light').style.display='none'; 
    document.getElementById('fade').style.display='none'; 
    } 
else 
{ 
    alert("Error Password or Username");/*displays error message*/ 
    } 
}

사용자가 올바른 이름과 패스를 입력하면 라이트 박스 효과가 사라지는 "admin"입니다.하지만 라이트 박스는 그대로 있습니다. 어떻게 닫을 수 있습니까? 또한이 litebox 효과는 페이지가로드 될 때 표시되어야합니다.

출처

2012-04-18 Hanya Idrees

는

var name= $("#name").val(); 
var pass=$("#password").val();

출처

2012-04-18 19:31:02 d4rkpr1nc3

감사합니다,하지만 같은 일이 라이트 박스 효과는 여전히 존재, 발생하지 않습니다. 또한 ww.php? name = admin & password = admin & submit = Sign +이 주소창에 매번 나타납니다. –

@HanyaIdrees 위와 같이 교정 한대로 .val()을 사용하십시오. 시도해 봤어? – axcdnt

@axcdnt 시도했지만 동일한 결과가 나타납니다. 왜 그런지 몰라.? –

와

var name= $("#name"); 
var pass=$("#password");

캡처 및 방지하지 않는 이벤트를 제출하는 문제가 교체? 마크 업에는 양식이 없습니다. 당신이

<form id="submit-me"> your form inputs </div>

처럼 추가 할 경우 당신은 당신이 추가 할 수있는 실제 예를 들어 JS

$("#submit-me").submit(function(event) { 
    // your js code 
    event.preventDefault(); 
});

를 통해 그것을 관찰 할 수있다 "false를 반환;" onclick 처리기에서? 하지만 ...이 작동하는지 알고 내가 위의 코드를 추가 한

출처

2012-04-18 19:42:43

lightBox를 통한 로그인 양식

답변

관련 문제