2017-01-10 7 views
1

フォームを送信した後にdivに入力フィールド値を表示しようとしていますが、できません。
私は間違っていますか?

誰かが私を助けることができますか?入力フィールドの値を取得し、javascriptを使用してdivに表示します

function validate() { 
 
     var a = document.forms["Form"]["uname"].value; 
 
     var validation=true; 
 

 
     if ((a == null || a == "")||(!a.match(/^([a-zA-Z]{2,30})$/))) { 
 
     document.getElementById('uname').className = 'box'; 
 
     document.getElementById('popup').innerHTML= document.getElementById('uname').value; 
 
     validation=false; 
 
     } else{ 
 
     document.getElementById('uname').className = ''; 
 
     } 
 

 
     return validation; 
 
}
.box { 
 
    border: 2px solid red; 
 
} 
 
#popup { 
 
    width:25%; 
 
    height:115px; 
 
    background-color: red; 
 
    margin-top:2% ; 
 
    margin-left: 60%; 
 
    color: black; 
 
}
<head> 
 
</head> 
 
<body> 
 
    <form method="post" name="Form" onsubmit="return validate()" action="" id="form_id"> 
 
     <label>NAME:</label> 
 
     <input type="text" name="uname" id="uname" class="fields" > 
 
     <button type="submit" name="submit">SUBMIT</button> 
 
     <div id="popup"></div> 
 
    </form> 
 
</body>

+1

作品でなければなりません:http://output.jsbin.com/fujacuh –

+0

コードだけで正常に動作します。私はそれにも何の問題も見ません。 –

+0

これは奇妙な形式です。検証に失敗した場合はポストしますが、成功した場合はポストしません。 – Pete

答えて

0

問題があれば、他の条件です。内部HTMLは他の条件で私のために

if ((a == null || a == "")||(!a.match(/^([a-zA-Z]{2,30})$/))) { 
     document.getElementById('uname').className = 'box'; 
     validation=false; 
     } else{ 
     document.getElementById('uname').className = ''; 
     document.getElementById('popup').innerHTML= document.getElementById('uname').value; 
     } 
+0

@Mosh Feuありがとう。 – user7397787

関連する問題