js 및 jquery는 라디오 버튼, 확인란 및 드롭다운 상자를 각각 확인합니다

js 및 jquery는 라디오 버튼, 확인란 및 드롭다운 상자를 각각 확인합니다_javascript 기술

WBOY

풀어 주다： 2016-05-16 15:25:13

원래의

1704명이 탐색했습니다.

이 글에서는 라디오, 체크박스, 드롭다운박스(선택)의 js 검증과 jQuery 검증을 각각 소개하고 있으니 참고하시기 바랍니다.
(1) 먼저 라디오에 대해 이야기해 보겠습니다. 라디오와 체크박스는 모두 동일한 이름과 여러 값을 가지고 있습니다. 라디오 값을 가져올 때 일반적인 텍스트 상자 값 메서드를 따를 수는 없지만 어느 것을 결정하려면 선택되었습니다.

JS 확인은 getElementsByName()을 사용하여 배열을 가져오는 것입니다
js 코드는 다음과 같습니다.

 <script>
 function test(){
  var sex = document.getElementsByName("sex");
  var flag = 0;
  for (var i=0;i<sex.length;i++)
  {
  if (sex.item(i).checked == true)
  {
   flag = 1;
   break;
  }
  }
  if (!flag)
  {
  alert("请选择性别");
  }
 }
 </script>
  <input type="radio" name="sex" value="m">男<input type="radio" name="sex" value="f">女
  <input type="button" id="btn" value="提交" onclick="test()">

로그인 후 복사

jQuery를 사용하여 확인하는 것이 훨씬 간단합니다. 작성을 줄이고 더 많은 작업을 수행할 수 있습니다. 하하:

<script src="jquery-1.7.1.min.js"></script>
 <script>
$(document).ready(function(){
$("#btn").click(function(){
if ($(":radio:checked").length == 0)
{
alert("你的性别未选择");
}
});
});
 </script>
  <input type="radio" name="sex" value="m">男<input type="radio" name="sex" value="f">女
  <input type="button" id="btn" value="提交">

로그인 후 복사

(2) 체크박스, 체크박스와 라디오 버튼이 완전히 동일하기 때문에 이에 대해 실제로 이야기할 필요는 없습니다. 위 스크립트에서 라디오를 체크박스로 변경하면 괜찮습니다. .

(3) 드롭다운 상자(선택)
js 확인, js 코드 사용:

<script>
function test(){
var sex = document.getElementById("sex").value;
if (!sex)
{
alert("你的性别未选择");
}
}
 </script>
  <select id="sex">
<option value="">--请选择性别--</option>
<option value="m">男</option>
<option value="f">女</option>
  </select>
  <input type="button" id="btn" value="提交" onclick="test()">

로그인 후 복사

jQuery를 사용하여 유효성 검사:

 <script src="jquery-1.7.1.min.js"></script>
 <script>
$(document).ready(function(){
$("#btn").click(function(){
if ($("#sex").val() == '')
{
alert("你的性别未选择");
}
});
});
 </script>
  <select id="sex">
<option value="">--请选择性别--</option>
<option value="m">男</option>
<option value="f">女</option>
  </select>
  <input type="button" id="btn" value="提交">

로그인 후 복사

위 내용은 js와 jquery를 각각 사용하여 라디오 버튼, 체크박스, 드롭다운 박스를 확인하는 코드입니다. 모두의 학습에 도움이 되기를 바랍니다.