요소에 특정 속성이있는 경우에만 변경 이벤트 실행

라디오 버튼에 data-price 속성이있는 경우에만 일부 계산을 수행해야합니다. 현재 계산은 모든 라디오 버튼에 대해 항상 실행됩니다.요소에 특정 속성이있는 경우에만 변경 이벤트 실행

나는 내 코드를 첨부하였습니다. 아무도 이것에 나를 도울 수 있습니까?

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head id="Head1" runat="server"> 
<title>Hotel Beds</title> 
<script type="text/javascript" 
    src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" 
></script> 
<script type="text/javascript"> 

    $(document).ready(function() { 
     var values = {}; 
     $('input:radio').change(function() { 
      var name = $(this).attr('name'); 
      values[name] = parseFloat($(this).data('price')); 
      var total = 0.0; 
      $.each(values, function(i, e) { 
       total += e; 
      }); 
      $('#total').text(total.toFixed(2)); 
     }); 
    });    
    </script> 
</head> 
<body> 
    <form id="form1"> 
    <div> 
     <input type="radio" name="t1" data-price="25" checked="checked" /> 
     <span>Price 25</span> 
     <input type="radio" name="t1" data-price="30" /> 
     <span>Price 30</span> 
     <br /> 
     <input type="radio" name="t2" data-price="40" /> 
     <span>Price 40</span> 
     <input type="radio" name="t2" data-price="50" /> 
     <span>Price 50</span> 
     <br /> 
     <input type="radio" name="G" /><span>Male</span> 
     <input type="radio" name="G" /><span>Female</span> 
     <input id="total" type="text" /> 
    </div> 
    </form> 
</body> 
</html>

출처

2013-07-18 Sirojan Gnanaretnam

나는 라디오 버튼 데이터 가격 속성이있는 경우 몇 가지 계산을 할 필요가있다.
$('input:radio[data-price]').change(... 
사이드 참고 :

당신은 그 속성이 바로 라디오 버튼에 선택 제한 할 "has attribute" selector을 사용할 수 있습니다, jQuery의 CSS 확장을 사용하여 가장 방법이 아닙니다을 as it says in the :radio API documentation 때문에, jQuery가 브라우저의 기본 처리로 넘어갈 수 없음을 의미합니다. 대신 :

$('input[type=radio][data-price]').change(...

출처

2013-07-18 06:51:34

칠초 빠른 볼, 그래서뿐만 아니라 당신을 upvote에 있습니다하십시오. – adeneo

@adeneo : :-) ... –

총계를 추가하려면 하나를 변경해야했습니다.

$(document).ready(function() { 

    var values = {}; 
    $('input:radio[data-price]').change(function(){ 

      var name = $(this).attr('name'); 
      values[name] = parseFloat($(this).data('price')); 
      var total = 0.0; 
      $.each(values, function (i, e) { 
      total += e; 
      console.log('total', total); 
      }); 
      $('#total').val(total.toFixed(2)); // val(total) instead of text(total) 
    }); 
});

는 working demo at plnkr.co

출처

2013-07-18 07:24:38 surfmuggle

좋은 캐치. ... –

요소에 특정 속성이있는 경우에만 변경 이벤트 실행

답변

관련 문제