로그인 등록 페이지 폼 검증 원생 js

2399 단어 프런트 엔드



    
    
    
  <script src="./js/jquery.js"/>

<link rel="stylesheet" href="css/main.css"/>


<section class="top-img">
  <image src="img/toubu@2x.png"/>
</section>
<section>
  <p id="login">
    </p><form action="#" method="post">
      <p>
        <image src="img/me@2x.png" class="input-left"/>
        <input type="text" id="name" required="required" placeholder=" " maxlength="10" for="name"/>
      </p>
      <p class="input-p">
        <image src="img/phone@2x.png" class="input-left"/>
        <input type="text" id="phone" required="required" placeholder=" " maxlength="11"/>
        <image src="img/kejian@2x.png" class="input-right"/>
      </p>
      <input class="but" type="button" value=" " id="send"/>
    </form>
  
</section>
<section class="checkbox">
    <input type="checkbox" id="ch"/>
    <span class="checkbox-p"> <a onclick="" class="a-link"> </a> <a class="a-link"> </a> </span>
</section>


<script>

  window.onload = function () {

    var name = document.getElementById('name');
    var phone = document.getElementById('phone');
    var send = document.getElementById('send');
    var ch = document.getElementById('ch')

    var phoneR = /(^1[3|4|5|7|8]\d{9}$)|(^09\d{8}$)/

    send.onclick = function () {
      if (name.value == '') {
        alert(' ')
        return
      }
      if(){}
      if (!phoneR.test(phone.value)) {
        alert(' ')
        return
      }
      if (!ch.checkbox) {
        alert(' ')
        return
      }
    }
  }

</script>
<script src="js/main.js"/>


</code></pre> 
  <p> </p> 
 </div> 
</div>
                            </div>
                        </div>

좋은 웹페이지 즐겨찾기