2016-10-08 5 views
-1

양식은자바 스크립트 양식 제출이 작동하지 않습니다. 뭐가 될수 있었는지?

button { 
 
    right: 10px; 
 
    bottom: 10px; 
 
    position: absolute; 
 
} 
 
p { 
 
    font: 22px Helvetica, Arial, Sans-Serif; 
 
    text-shadow: 0px 1px 1px #040607; 
 
} 
 
q { 
 
    padding-bottom: 15px; 
 
    font: 24px Helvetica Bold, Arial, Sans-Serif; 
 
} 
 
textarea { 
 
    padding: 12px; 
 
    font: 16px Helvetica Bold, Arial, Sans-Serif; 
 
    
 
    width: 300px; 
 
    height: 120px; 
 
} 
 
.quote { 
 
    top: 20px; 
 
    margin: auto; 
 
    position: relative; 
 
    
 
    width: 436px; 
 
    height: 270px; 
 
} 
 

 
a { 
 
    color: #FF9C00; 
 
} 
 
button { 
 
    color: #FFFFFF; 
 
    
 
    background: #FFAF30; 
 
    box-shadow: inset 0px 4px 8px #FF9C00; 
 
    
 
    border-style: solid; 
 
    border-radius: 16px; 
 
    border-color: #FF9C00; 
 
    
 
    padding: 3px; 
 
    padding-left: 16px; 
 
    padding-right: 16px; 
 
} 
 
button, a{ 
 
    text-align: center; 
 
    letter-spacing: 1px; 
 
    text-decoration: none; 
 
    text-transform: uppercase; 
 
    text-shadow: 1px 1px 1px #040607; 
 
    
 
    font-weight: bold; 
 
    font: 22px Monaco, Sans-Serif; 
 
} 
 
fieldset{ 
 
    width: 436px; 
 
    height: 270px; 
 
    position: relative; 
 

 
    line-height: 50px; 
 
    border-radius: 12px; 
 
    border-color: #040607; 
 
    font: 22px Helvetica, Arial, Sans-Serif; 
 
} 
 
footer { 
 
    width: 100%; 
 
    height: 60px; 
 
    padding-top: 35px; 
 
    
 
    left: 0px; 
 
    right: 0px; 
 
    bottom: 0px; 
 
    position: fixed; 
 
    
 
    text-align: center; 
 
    text-transform: uppercase; 
 
    text-shadow: 0px 0px 10px #0851A8; 
 
    
 
    color: #FFFFFF; 
 
    font-weight: bold; 
 
    font: 15px Monaco, Sans-Serif; 
 

 
    background: #3780D8; 
 
    box-shadow: inset 0px 10px 20px #0851A8; 
 
    opacity: .95; 
 
} 
 
legend{ 
 
    font-weight: bold; 
 
    letter-spacing: 2px; 
 
    font: 30px Helvetica Bold, Arial, Sans-Serif; 
 
    
 
    color: #3780D8; 
 
    text-align: left; 
 
    text-shadow: 0px 2px 1px #040607; 
 
} 
 
li{ 
 
    list-style-type: none; 
 

 
    line-height: 25px; 
 
    padding-bottom: 1px; 
 
    
 
    color: #040607; 
 
    text-shadow: 0px 1px 1px #2E3845; 
 
    font: 22px Helvetica Bold, Arial, Sans-Serif; 
 

 
    text-align: center; 
 
} 
 
textarea { 
 
    margin: auto; 
 
    position: absolute; 
 
    resize: none; 
 

 
    width: 270px; 
 
    height: 166px; 
 

 
    top: 0px; 
 
    left: 0px; 
 
    right: 0px; 
 
    bottom: 0px; 
 

 
    border-radius: 6px; 
 
    box-shadow: 1px 2px 4px #040607; 
 
} 
 
q { 
 
    display: block; 
 
    
 
    font-weight: bold; 
 
    font: 26px Helvetica Bold, Arial, Sans-Serif; 
 
    
 
    text-align: center; 
 
    text-decoration: none; 
 
    
 
    color: #040607; 
 
    text-shadow: 0px 1px 1px #2E3845; 
 
} 
 
.content { 
 
    top: 0px; 
 
    left: 0px; 
 
    right: 0px; 
 
    bottom: 0px; 
 
    position: fixed; 
 
    
 
    width: 100%; 
 
    min-height: 100%; 
 
    
 
    background: #FFFFFF; 
 
} 
 
.left { 
 
    left: 5%; 
 
    top: 120px; 
 
    float: left; 
 
    margin: auto; 
 
    position: relative; 
 
    
 
    width: 40%; 
 
} 
 
.right { 
 
    right: 5%; 
 
    top: 120px; 
 
    float: right; 
 
    margin: auto; 
 
    position: relative; 
 
    
 
    width: 40%; 
 
} 
 
.italic { 
 
    font-style: italic; 
 
}
<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<meta charset="UTF-8"> 
 
<title>SMPentest Challenge</title> 
 
<link rel="stylesheet" href="/static/css/final.css" /> 
 
<link rel="stylesheet" href="/static/css/style.css" /> 
 
<script> 
 
function validateForm() { 
 
    alert("Submitted Successfully!"); 
 
    return true; 
 
} 
 
</script> 
 
</head> 
 
<body> 
 
<div class="content"> 
 
    <div class="left"> 
 
     <div class="quote"> 
 
      <q class="normal">Submit the form.</q> 
 
      <q class="italic">Test</q> 
 
      <q class="normal">Test</q> 
 
      <q class="italic">Test</q> 
 
      <q class="normal">Test</q> 
 
     </div> 
 
    </div> 
 
    <div class=right> 
 
     <form method="POST" onsubmit="return validateForm();" action="#"> 
 
      <fieldset> 
 
       <legend>Contact Info</legend> 
 
       <table> 
 
        <tr> 
 
         <td><label for="name">name</label></td> 
 
         <td><input name="name" id="name" type="text" size="20" maxlength="30" required autocomplete="off" placeholder="Required"/></td> 
 
        </tr> 
 
        <tr> 
 
         <td><label for="email">email</label></td> 
 
         <td><input name="email" id="email" type="text" size="20" maxlength="2" required autocomplete="off" placeholder="Required"/></td> 
 
        </tr> 
 
       </table> 
 
       <p>Preferred Choice:</p> 
 
       <div class=boxes> 
 
        <input name="summer" id="summer" type="checkbox"/> 
 
        <label for="summer">#1</label> 
 
        <br/> 
 
        <input name="winter" id="winter" type="checkbox"/> 
 
        <label for="winter">#2</label> 
 
        <br/> 
 
        <input name="fall" id="fall" type="checkbox"/> 
 
        <label for="fall">#3</label> 
 
        <br/> 
 
       </div> 
 
       <input name="i_know" type=hidden value="KungFu!"/> 
 
       <button name="submit" type="submit">Submit</button> 
 
      </fieldset> 
 
     </form> 
 
    </div> 
 
</div> 
 
<footer>Test Page</footer> 
 
</body> 
 
</html>

+3

콘솔에 오류가 있습니까? 나를 위해 일하는 것 같습니다. – Janar

+2

나는 그것이 성공했다는 경고를 받는다. 그 밖의 무엇을 기대하고 있습니까? 폼이 처리되지 않는다는 것을 의미한다면'action = "#"'을 왜 사용하고 있습니까? – j08691

+0

[* 최소 ** 완전하고 검증 가능한 예 *를 만드는 방법 (http://stackoverflow.com/help/mcve)]을 읽어보십시오. 예제를 만드는 과정에서 문제를 부각시켜 질문 할 필요가 없을 때가 많습니다. – RobG

답변

-3

액션 필드가 양식을 제출 할 위치로 설정해야합니다 제출하지 않습니다. 현재 아무 것도 설정되어 있지 않습니다.

action="#" 

작은 기능의 경우에도 인라인 자바 스크립트를 사용하지 않는 것이 좋습니다.

+2

인라인 자바 스크립트에 무엇이 문제가 있습니까? 왜 그런지에 대한 사실적 증거없이 당신의 권고에 근거하지 않고 왜 추천할만한 이유인지 설명하십시오. – Ricky

+0

그것의 잘못은 testcase ...하지만 structre 귀하의 응용 프로그램이 더 깨끗한 명명 된 파일 instaed 많은 인라인 코드 .. .. 또한 '건조한 코드에 대한 ... 그래서 당신의 기능을 재사 용할 수 있습니다 다른 html 파일을 사용하면 변경해야 할 경우 validateXyForm 함수에 'formHandle.js'파일에 'js'폴더를 넣을 수 있습니다 –

관련 문제