0
내가 basicly했던 것은 그 다음입니다 : HTML/PHP 양식 :JQuery와 입력 동적 확인
<html>
\t <head>
\t \t <link rel="stylesheet" type="text/css" href="gstyle.css">
\t </head>
\t <body>
\t <script type="text/javascript" src="resources/jquery-1.11.2.min.js"></script>
\t <script type="text/javascript" src="resources/jquery-ui/jquery-ui.min.js"></script>
\t <script type="text/javascript" src="script.js"></script>
\t \t \t <form method="POST">
\t \t \t \t <table border=0>
\t \t \t \t \t <tr>
\t \t \t \t \t \t <td class="descripcion">Usuario:</td>
\t \t \t \t \t \t <td><input class="campos" type="text" name="user" placeholder="Nombre de usuario"></td>
\t \t \t \t \t </tr>
\t \t \t \t \t <tr>
\t \t \t \t \t \t <td class="descripcion">Contraseña:
\t \t \t \t \t \t <td><input class="campos" type="password" name="passwd" placeholder="Contraseña"></td>
\t \t \t \t \t </tr>
\t \t \t \t \t <tr>
\t \t \t \t \t \t <td class="descripcion">Confirmar contraseña:</td>
\t \t \t \t \t \t <td><input class="campos" type="password" name="confpasswd" placeholder="Confirmar Contraseña"></td>
\t \t \t \t \t </tr>
\t \t \t \t \t <tr>
\t \t \t \t \t \t <td class="descripcion">Correo:</td>
\t \t \t \t \t \t <td><input class="campos" type="text" name="correo" placeholder="E-Mail"></td>
\t \t \t \t \t </tr>
\t \t \t \t \t <tr>
\t \t \t \t \t \t <td class="descripcion">Confirmar correo:</td>
\t \t \t \t \t \t <td><input class="campos" type="text" name="confcorreo" placeholder="Confirmar E-Mail"></td>
\t \t \t \t \t </tr>
\t \t \t \t </table>
\t \t \t \t <br>
\t \t \t \t <input class="botones" type="submit" name="send" value="Registrar">
</form>
\t </div>
\t </body>
</html>는 CSS 클래스와 간단한 regiter 처방집입니다. 에 클래스를 추가 한 후 몇 가지 입력을 평가하는 것입니다 objetive
#form {
\t font-family: Tahoma;
\t font-size: 20px;
\t margin-top: 200px;
\t margin-left: auto;
\t margin-right: auto;
\t padding: 20px 10px 20px 50px;
\t width: 700px;
\t text-align: center;
\t border-radius: 5px;
\t background: url("imagenes/div_fondo.jpg");
\t background-size: cover;
\t background-position: center center;
\t background-repeat: no-repeat;
\t background-attachment:fixed;
\t -webkit-box-shadow: 10px 10px 15px 0px rgba(0,0,0,0.8);
\t -moz-box-shadow: 10px 10px 15px 0px rgba(0,0,0,0.8);
\t box-shadow: 10px 10px 15px 0px rgba(0,0,0,0.8);
}
#head {
\t color: white;
\t font-family: Tahoma;
\t font-size: 20px;
\t margin-top: 20px;
\t margin-left: auto;
\t margin-right: auto;
\t padding: 10px 0px 10px 0px;
\t width: 1500px;
\t text-align: center;
\t border-radius: 5px;
\t background: url("imagenes/div_fondo.jpg");
\t background-size: cover;
\t background-position: center center;
\t background-repeat: no-repeat;
\t background-attachment:fixed;
\t text-shadow: 0px 0px 15px #2222FF;
\t -webkit-box-shadow: 10px 10px 15px 0px rgba(0,0,0,0.8);
\t -moz-box-shadow: 10px 10px 15px 0px rgba(0,0,0,0.8);
\t box-shadow: 10px 10px 15px 0px rgba(0,0,0,0.8);
}
td {
\t padding-top: 15px;
}
#titulo{
\t text-shadow: 0px 0px 8px #2222FF;
\t line-height: 5px;
\t color: white;
}
.descripcion{
\t text-shadow: 0px 0px 8px #2222FF;
\t color: white;
\t text-align:right;
\t font-size: 20px;
}
.campos{
\t -webkit-box-shadow: inset 3px 3px 3px 0px rgba(0,0,0,0.78);
\t -moz-box-shadow: inset 3px 3px 3px 0px rgba(0,0,0,0.78);
\t box-shadow: inset 3px 3px 3px 0px rgba(0,0,0,0.78);
height: 40px;
margin: 15px;
padding: 12px;
width: 300px;
font-size: 18px;
border: 0;
\t border-radius: 3px;
}
.campos:focus {
\t -webkit-box-shadow: 0px 0px 13px 6px rgba(36,160,255,1);
\t -moz-box-shadow: 0px 0px 13px 6px rgba(36,160,255,1);
\t box-shadow: 0px 0px 13px 6px rgba(36,160,255,1);
}
.correcto{
\t -webkit-box-shadow: 0px 0px 13px 6px rgba(0,255,81,1);
\t -moz-box-shadow: 0px 0px 13px 6px rgba(0,255,81,1);
\t box-shadow: 0px 0px 13px 6px rgba(0,255,81,1);
}
.incorrecto{
\t -webkit-box-shadow: 0px 0px 13px 6px rgba(255,0,0,1);
\t -moz-box-shadow: 0px 0px 13px 6px rgba(255,0,0,1);
\t box-shadow: 0px 0px 13px 6px rgba(255,0,0,1);
}
.botones {
\t -webkit-box-shadow: 10px 10px 15px 0px rgba(0,0,0,0.8);
\t -moz-box-shadow: 10px 10px 15px 0px rgba(0,0,0,0.8);
\t box-shadow: 10px 10px 15px 0px rgba(0,0,0,0.8);
\t background-color:#7C1919;
\t width: 250px;
\t height: 50px;
\t border: 0;
\t font-size: 20px;
}
$(document).ready(function(){
\t var user = $("input[name=user]").val();
\t if(user === "Vitama") {
\t \t $("input[name=user]").addClass("correcto");
\t }
});
질문은 무엇입니까? 무슨 문제 있니? 코드를 게시했지만 문제를 충분히 설명하지 못하는 것이 좋습니다. – j08691
문제는 필자가 한 일이 동적 인 동적 조합을 만들 것이라고 맹세했기 때문이며, 그렇지 않은 경우 유효성 검사를 위해 페이지를 다시로드해야했습니다. – Vitama