jQuery iPhone 스타일 체크 박스로 스키닝 할 때 체크 박스가 jQuery PCP에서 이벤트를 트리거하지 않음

Question

HTML 및 jQuery를 사용하여 양식을 작성했습니다. 이 양식은 사용자의 의견을 즉석에서 생성하도록 설계되었습니다.

jQuery iPhone 스타일 체크 박스 (iSC)를 사용하여 이전에 사용 된 확인란도 사용하고 싶습니다.

저는 iSC뿐만 아니라 jQuery Price Calculator Pro (PCP)도 구현했습니다. iSC가 구현되지 않으면 시스템이 완벽하게 작동하지만 iSC가 구현되면 가격 변경이 더 이상 트리거되지 않습니다.

이벤트가 .click에 의해 실행 되었기 때문에 나는 이것이 사실이 아님을 알았습니다.

나는 나 그것이 작동하기 위해서는 그 PCP의 요구에 무엇이든 트리거 그 코드의 라인을 추가 할 수 다음 구현 할 수 있었다 : 당신이 볼 수 있듯이

$(window).load(function() {    

var onchange_checkbox = ($('#eCommerce')).iphoneStyle({ 
    onChange: function() { 
      if ($('#eCommerce').is(':checked')) { 
       $('#eCommerce-Output').removeClass('dispnone'); 
       console.log('eCommerce is on'); 
     } 
      else { 
      $('#eCommerce-Output').addClass('dispnone'); 
      console.log('eCommerce is off'); 
      }; 
    } 
}); 

을 콘솔을 통해 live version of the page - 아이폰 토글이 전환되면 위의 트리거가 완벽하게 수행됩니다.

상단에있는 스타일이없는 체크 박스를 선택하면 내가하고 싶은 것을 볼 수 있습니다. can be found here에 해당하는 .js 파일.

모든 도움을 주시면 대단히 감사하겠습니다.

Answer 1

가격은 양식 입력 중 하나에 대한 변경 이벤트가 트리거 될 때마다 갱신됩니다. 따라서 iPhone 스타일 체크 박스가 변경되면이 이벤트를 수동으로 트리거해야합니다.

편집 : iPhone 스타일 체크 박스는 실제로 체크 박스 요소를 첫 번째 매개 변수로 onChange 함수에 전달합니다. 이 키워드는 예상대로 작동하지 않습니다. 그에 따라 내 대답을 업데이트했습니다.

var onchange_checkbox = ($('#eCommerce')).iphoneStyle({ 
    onChange: function(input) { 
     input.trigger('change'); 
    } 
}); 

이 정보가 도움이되기를 바랍니다.

벤. 에서는 widgetized DOM을 검사

Answer 2

는 다음 작동해야한다고 생각하는 날 리드 :

$(function() {    
    var onchange_checkbox = ($('#eCommerce')).iphoneStyle({ 
     onChange: function() { 
      $(this).closest('.iPhoneCheckContainer').find('input').trigger('change'); 
     } 
    }); 
}); 

를 작동하면,이 점에서 일반적인 해결책이 될 것이다 'onChange가'핸들러 :

• 만든다 요소 id에 관한 가정은 없습니다.
• 위젯이 만들어진 (여전히 존재하는) 기본 입력 요소 (checkbox/radiobutton)를 찾기 위해 클릭 된 위젯과 관련하여 작동하고 해당 변경 이벤트를 트리거합니다.