어떻게하면 모든 텍스트 상자 가진 클래스의 값을 총 수 1
, 2
그리고 3
내부에 넣어 sum_1
, sum_2
및sum_3
나는 이런 식으로 시도했다
여기에 Jquery :
$(document).on("change", ".1", function() {
var sum = 0;
$(".1").each(function(){
sum += +$(this).val();
});
$(".total").val(sum);
});
여기에 HTML :
<input type="text" class="1" value="1" />
<input type="text" class="2" value="2" />
<input type="text" class="3" value="5" />
다음은 하나의 값에 대해 잘 작동 하는 바이올린 http://jsfiddle.net/5gsBV/36/ 입니다.
그러나이 바이올린 http://jsfiddle.net/vL6f2tow/1/에 주어진 질문에서 묻는 것과 같은 3 가지 값에 대해 어떻게 할 수 있습니까?
그리고 총합의 값을 어떻게 얻을 수 있습니까?
로드시 수행하려면 다음과 같이해야합니다.
$('.item').each(function(){
var itemNumber = $(this).attr('class').split(" ");
itemNumber.splice( itemNumber.indexOf("item"), 1 );
var sumElement = $(".sum_" + itemNumber);
var sum = (sumElement.val() == "") ? 0 : parseInt(sumElement.val());
sum += parseInt($(this).val());
sumElement.val(sum);
});
다음은 로컬 합계를 계산 하는 데모입니다.
전역 합계 (지역 합계의 합계)를 계산하려면 여기에 데모 2가 있습니다.
이러한 입력 그룹이 여러 개있는 경우 합계를 계산하기 위해 고려해야하는 입력 요소를 알 수 있도록 각 입력에 클래스를 추가해야합니다.
<input type="text" class="item 1" value="1" />
<input type="text" class="item 2" value="2" />
<input type="text" class="item 2" value="3" />
<input type="text" class="item 2" value="4" />
<input type="text" class="item 3" value="5" />
<input type="text" class="item 3" value="6" />
<input type="text" class="item 3" value="7" />
<br>
<br>
<input type="text" class="sum_1" value="" />
<input type="text" class="sum_2" value="" />
<input type="text" class="sum_3" value="" />
$(document).on("change", ".item", function () {
var sum = 0;
var itemNumber = $(this).attr('class').split(" ");
itemNumber.splice( itemNumber.indexOf("item"), 1 );
$('.'+itemNumber).each(function () {
sum += parseInt($(this).val());
});
$(".sum_" + itemNumber).val(sum);
});
위의 스크립트에서
$ (this) .attr ( 'class')는 "item 1"처럼 보입니다.
$ (this) .attr ( 'class'). split ( "")은 배열 [ "item", "1"]이됩니다.
그런 다음 단어를 제거 item
하고 사용합니다."1"
다음은 데모입니다.
도움이 되었기를 바랍니다.
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다