jQuery validate 검증 라디오 인 스 턴 스

구체 적 인 코드 는 다음 과 같다.

<div class="row cl"> 
  <label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>     ：</label> 
  <div class="formControls col-xs-8 col-sm-9 skin-minimal"> 
    <div class="radio-box"> 
      <input name="couponType" type="radio" value="1" id="couponType_1" <#if couponInfo.couponType == 1>checked</#if>> 
      <label for="couponType_1">   </label> 
    </div> 
    <div class="radio-box"> 
      <input type="radio" name="couponType" value="2" id="couponType_2" <#if couponInfo.couponType == 2>checked</#if>> 
      <label for="couponType_2">   </label> 
    </div> 
    <div class="radio-box"> 
      <input type="radio" name="couponType" value="3" id="couponType_3" <#if couponInfo.couponType == 3>checked</#if>> 
      <label for="couponType_3">   </label> 
    </div> 
  <label id="couponType-error" for="couponType" class="error"></label> 
  </div> 
</div> 
<div class="row cl" id="couponMax_div"> 
  <label class="form-label col-xs-4 col-sm-3">      ：</label> 
  <div class="formControls col-xs-8 col-sm-9"> 
    <input type="text" class="input-text" placeholder="           " name="couponMax" id="couponMax" value="${couponInfo.couponMax}"> 
  </div> 
</div> 

그 중에서 사용자 정의 오류 알림 위 치 는<label id="couponType-error" for="couponType" class="error"></label>이 있 는 위 치 를 수정 하면 됩 니 다.id 와 for 의 내용 은 브 라 우 저 에서 F12 로 볼 수 있 습 니 다.

$("#form-member-add").validate({ 
  rules:{ 
    sendCouponType:{ 
      required:true 
    }, 
    platformId:{ 
      required:true 
    }, 
    couponType:{ 
      required:true 
    } 
  }, 
  onkeyup:false, 
  focusCleanup:true, 
  success:"valid", 
  submitHandler:function(form){ 
    var couponInfo = getCouponParameter(); 
    saveCouponInfo(couponInfo); 
  } 
}); 
function saveCouponInfo(couponInfo){ 
  $.ajax({ 
    type:'POST', 
    url: "/coupon/save", 
    data: { 
      couponStr:couponInfo 
    }, 
    async: false, 
    success: function(data){ 
      if(data.code == 200){ 
        var index = parent.layer.getFrameIndex(window.name); 
        parent.$('#btn_search').click(); 
        parent.layer.close(index); 
      }else layer.alert("    "); 
    } 
  });  
} 
//          
var getCouponParameter = function(){ 
  var couponInfo = {}; 
  couponInfo.id = couponId; 
  //        
  couponInfo.couponName = $('#couponName').val(); 
  //     
  couponInfo.couponUsingRange = $("input[name='couponUsingRange']:checked").val(); 
  //     
  couponInfo.sendCouponType = $("input[name='sendCouponType']:checked").val(); 
  //     
  couponInfo.platformId = $("input[name='platformId']:checked").val(); 
  //      
  couponInfo.couponType = $("input[name='couponType']:checked").val(); 
  //        
  couponInfo.meetPrice = $('#meetPrice').val(); 
  //      
  couponInfo.couponAmount = $('#couponAmount').val(); 
  //       
  couponInfo.couponStartDate = $('#couponStartDate').val(); 
  //       
  couponInfo.couponEndDate = $('#couponEndDate').val(); 
  //      
  couponInfo.couponNum = $('#couponNum').val(); 
  //            
  couponInfo.limitGetNum = $('#limitGetNum').val(); 
  //   
  couponInfo.remark = $('#remark').val(); 
  return JSON.stringify(couponInfo); 
} 
$("input:radio[name='couponType']").click(function(){ 
  //1.      2.       3.    
  var tt = $(this).val(); 
  switch(tt){ 
    case '1' : 
      $('#couponMax_div').hide(); 
      break; 
    case '2' : 
      $('#couponMax_div').show(); 
      break; 
    case '3' : 
      $('#couponMax_div').hide(); 
      break; 
    default: 
      break; 
  } 
}); 

위 에 서 는 인 자 를 검증 하고 배경 에 전달 하 며 라디오 에 감청 사건 을 연결 합 니 다.
위 에서 말 한 것 은 소 편 이 소개 한 jQuery vaidate 검증 radio 인 스 턴 스 입 니 다.여러분 에 게 도움 이 되 기 를 바 랍 니 다.궁금 한 점 이 있 으 시 면 메 시 지 를 남 겨 주세요.소 편 은 제때에 답 해 드 리 겠 습 니 다.여기 서도 저희 사이트 에 대한 여러분 의 지지 에 감 사 드 립 니 다!