동일한 클래스를 가진 텍스트 상자의 값을 합산하고 jquery를 사용하여 다른 텍스트 상자에 넣는 방법

user4671040

어떻게하면 모든 텍스트 상자 가진 클래스의 값을 총 수 1, 2그리고 3내부에 넣어 sum_1, sum_2sum_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 가지 값에 대해 어떻게 할 수 있습니까?

업데이트 :

그리고 총합의 값을 어떻게 얻을 수 있습니까?

Dhiraj

로드시 수행하려면 다음과 같이해야합니다.

$('.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);
});

위의 스크립트에서

  1. $ (this) .attr ( 'class')는 "item 1"처럼 보입니다.

  2. $ (this) .attr ( 'class'). split ( "")은 배열 [ "item", "1"]이됩니다.

  3. 그런 다음 단어를 제거 item하고 사용합니다."1"

다음은 데모입니다.

도움이 되었기를 바랍니다.

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정
0

몇 마디 만하겠습니다

0리뷰
로그인참여 후 검토

관련 기사

Related 관련 기사

뜨겁다태그

보관