라디오 버튼 및 체크 박스에 동일한 이벤트 핸들러 추가

사용자 3063771

선택한 확인란과 라디오 버튼의 값을 추가하는 기능을 사용하려고합니다. 확인란의 값과 라디오 버튼의 기능을 추가 할 수있는 기능을 만들었지 만 둘을 하나의 작업 기능으로 결합하는 데 문제가 있습니다. 내 문제는 라디오와 확인란 요소가 모두.click()

내 코드는 https://jsfiddle.net/Buleria28/nz43u7x8/2/에서 볼 수 있습니다.

HTML은 다음과 같습니다.

<input type="checkbox" value="1" />test 1<br/>
<input type="checkbox" value="2" />test 2<br/>
<input type="checkbox" value="3" />test 3<br/>

<input type="radio" name="test" value="1" />test 4
<input type="radio" name="test" value="2" />test 5
<div id='sum'></div>

jQuery는 다음과 같습니다.

jQuery(document).ready(function($) {
var sum = 0;

$("input:checkbox"),$("input:radio").click(function() {
   sum = 0;
    $("input:checkbox:checked").each(function(idx, elm) {
        sum += parseInt(elm.value, 10);
    });

   sum = 0;
    $("input:radio:checked").each(function(idx, elm) {
        sum += parseInt(elm.value, 10);
    });
    $('#sum').html(sum);
  });
});
Shiladitya

여기 솔루션 https://jsfiddle.net/nz43u7x8/5/ 로 이동합니다.

jQuery(document).ready(function($) {
    var sum = 0;

    $("input:checkbox, input:radio").click(function() {
        sum = 0;
        $("input:checkbox:checked").each(function(idx, elm) {
            sum += parseInt(elm.value, 10);
        });

        $("input:radio:checked").each(function(idx, elm) {
            sum += parseInt(elm.value, 10);
        });
        $('#sum').html(sum);
    });
});

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

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

에서 수정
0

몇 마디 만하겠습니다

0리뷰
로그인참여 후 검토

관련 기사

분류에서Dev

데이터 UI 태그가있는 체크 박스 및 라디오 버튼에 대한 호버 기능

분류에서Dev

JavaScript 및 CSS 코드 디버깅 : 이벤트 핸들러 추가

분류에서Dev

여러 버튼에 동일한 이벤트 핸들러 사용

분류에서Dev

jquery : $ (input) .keydown이 라디오 버튼에 핸들러를 설정하지 못함, 텍스트에 동일한 코드가 작동 함

분류에서Dev

IE8에서 라디오 버튼 및 체크 박스 스타일 지정

분류에서Dev

IE8에서 라디오 버튼 및 체크 박스 스타일 지정

분류에서Dev

체크 박스 및 라디오 버튼 동작

분류에서Dev

동적으로 생성 된 버튼에 이벤트 핸들러 추가

분류에서Dev

라디오 버튼 / 체크 박스 / 옵션 선택-선택한 항목의 총 가격 (값) 추가 및 배열에 추가

분류에서Dev

라디오 버튼이 체크 박스처럼 동작하도록 만들기

분류에서Dev

Inno Setup에서 동일한 "CreateInputOptionPage"페이지에 체크 박스와 라디오 버튼을 가질 수 있습니까?

분류에서Dev

양식 텍스트 상자 및 확인란에서 사용자 입력 (예 : 계정 번호, 체크 박스, 체크 라디오 버튼)을 가져오고 db에서 파일 가져 오기

분류에서Dev

Powershell : 이벤트 핸들러가 for 루프 내부에있을 때 체크 박스 변경 이벤트가 유효한 결과를 제공하지 않습니다.

분류에서Dev

선택한 여러 라디오 버튼 값 및 uniqueId를 배열에 추가

분류에서Dev

버튼 동작없이 자바 스크립트에서 선택된 체크 박스 이름 가져 오기

분류에서Dev

동적으로 추가 된 이벤트 핸들러는 자바 스크립트에서 이전 이벤트 핸들러를 비활성화합니다.

분류에서Dev

이벤트 핸들러 및 클래스 인스턴스 추가

분류에서Dev

호버 이벤트 핸들러에 클래스 추가

분류에서Dev

이미지 및 핸들러가있는 C # 추가 버튼

분류에서Dev

이미지 및 핸들러가있는 C # 추가 버튼

분류에서Dev

HTML 요소에 이벤트 핸들러 추가 및 제거

분류에서Dev

명령 버튼을 통한 동적 체크 박스 이벤트

분류에서Dev

자바 스크립트를 사용하여 라디오 버튼 및 체크 박스 값을 자동으로 계산하는 방법

분류에서Dev

Blazor 서버를 사용할 때 클라이언트 DOM 자바 스크립트 이벤트 핸들러를 추가하는 방법은 무엇입니까?

분류에서Dev

요소를 동적으로 생성 할 때 자바 스크립트 이벤트 핸들러가 사라짐

분류에서Dev

동적으로 생성 된 버튼에 대한 이벤트 핸들러

분류에서Dev

ABAP OO 화면 컨트롤 (라디오 버튼 / 체크 박스)

분류에서Dev

Unity 퀵리스트에 체크 박스 또는 라디오 버튼을 추가하는 방법은 무엇입니까?

분류에서Dev

Unity 퀵리스트에 체크 박스 또는 라디오 버튼을 추가하는 방법은 무엇입니까?

Related 관련 기사

  1. 1

    데이터 UI 태그가있는 체크 박스 및 라디오 버튼에 대한 호버 기능

  2. 2

    JavaScript 및 CSS 코드 디버깅 : 이벤트 핸들러 추가

  3. 3

    여러 버튼에 동일한 이벤트 핸들러 사용

  4. 4

    jquery : $ (input) .keydown이 라디오 버튼에 핸들러를 설정하지 못함, 텍스트에 동일한 코드가 작동 함

  5. 5

    IE8에서 라디오 버튼 및 체크 박스 스타일 지정

  6. 6

    IE8에서 라디오 버튼 및 체크 박스 스타일 지정

  7. 7

    체크 박스 및 라디오 버튼 동작

  8. 8

    동적으로 생성 된 버튼에 이벤트 핸들러 추가

  9. 9

    라디오 버튼 / 체크 박스 / 옵션 선택-선택한 항목의 총 가격 (값) 추가 및 배열에 추가

  10. 10

    라디오 버튼이 체크 박스처럼 동작하도록 만들기

  11. 11

    Inno Setup에서 동일한 "CreateInputOptionPage"페이지에 체크 박스와 라디오 버튼을 가질 수 있습니까?

  12. 12

    양식 텍스트 상자 및 확인란에서 사용자 입력 (예 : 계정 번호, 체크 박스, 체크 라디오 버튼)을 가져오고 db에서 파일 가져 오기

  13. 13

    Powershell : 이벤트 핸들러가 for 루프 내부에있을 때 체크 박스 변경 이벤트가 유효한 결과를 제공하지 않습니다.

  14. 14

    선택한 여러 라디오 버튼 값 및 uniqueId를 배열에 추가

  15. 15

    버튼 동작없이 자바 스크립트에서 선택된 체크 박스 이름 가져 오기

  16. 16

    동적으로 추가 된 이벤트 핸들러는 자바 스크립트에서 이전 이벤트 핸들러를 비활성화합니다.

  17. 17

    이벤트 핸들러 및 클래스 인스턴스 추가

  18. 18

    호버 이벤트 핸들러에 클래스 추가

  19. 19

    이미지 및 핸들러가있는 C # 추가 버튼

  20. 20

    이미지 및 핸들러가있는 C # 추가 버튼

  21. 21

    HTML 요소에 이벤트 핸들러 추가 및 제거

  22. 22

    명령 버튼을 통한 동적 체크 박스 이벤트

  23. 23

    자바 스크립트를 사용하여 라디오 버튼 및 체크 박스 값을 자동으로 계산하는 방법

  24. 24

    Blazor 서버를 사용할 때 클라이언트 DOM 자바 스크립트 이벤트 핸들러를 추가하는 방법은 무엇입니까?

  25. 25

    요소를 동적으로 생성 할 때 자바 스크립트 이벤트 핸들러가 사라짐

  26. 26

    동적으로 생성 된 버튼에 대한 이벤트 핸들러

  27. 27

    ABAP OO 화면 컨트롤 (라디오 버튼 / 체크 박스)

  28. 28

    Unity 퀵리스트에 체크 박스 또는 라디오 버튼을 추가하는 방법은 무엇입니까?

  29. 29

    Unity 퀵리스트에 체크 박스 또는 라디오 버튼을 추가하는 방법은 무엇입니까?

뜨겁다태그

보관