JQuery 코드는 Firefox, Opera에서 작동하지만 Chrome 및 IE에서 작동하지 않습니다.

Question

다음 코드는 Firefox-20 및 Opera에서는 작동하지만 Chrome-26 또는 IE-10에서는 작동하지 않습니다. keyup 함수는 금액에 인도 쉼표를 추가합니다.

$(document).ready(function() { 
    $("#readyArea").on('change', function() { 
     $("#underConstArea").val($(this).val()).trigger('change'); 
    }); 

$('.comma').on('keyup', this, function commaFormatted(){ 
     var delimiter = ","; // replace comma if desired 
     var amount = $(this).val().replace(/\,/g,''); 
     var a = amount.split('.',2); 
     var d = a[1]; 
     var i = parseInt(a[0],10); 
     if(isNaN(i)) { return ''; } 
     var minus = ''; 
     if(i < 0) { minus = '-'; } 
     i = Math.abs(i); 
     var n = new String(i); 
     var a = []; 
     var cnt=0; 
     while(n.length > 2) 
     { 
      if(cnt == 0) 
      { 
       var nn = n.substr(n.length-3); 
       n = n.substr(0,n.length-3); 
       cnt++; 
      } 
      else 
      { 
       var nn = n.substr(n.length-2); 
       n = n.substr(0,n.length-2); 
      } 
      a.unshift(nn); 
     } 
     if(n.length > 0) 
     { 
      a.unshift(n); 
     } 
     n = a.join(delimiter); 
     amount = n; 
     amount = minus + amount; 
     $(this).val(amount); 
    }); 
}); 

다음은 JSFiddle link입니다. (Firefox 또는 Opera에서이 링크를 열면 js가 작동하지만 크롬이나 IE에서는 작동하지 않는다고 말한 것). 콘솔에는 js 오류도 없습니다. Chrome과 IE에 특정한 작업을 수행해야합니까?

편집

그냥 명확하게, 그것은 크롬과 IE에서 해고되지 않는 OnChange 이벤트입니다. 파이어 폭스와 오페라에서도 마찬가지다.

Answer 1

Chrome에서 테스트 한 결과, 쉼표가 제대로 작동했지만 텍스트 상자를 벗어난 후 Firefox에서 변경된 것을 보았을 때 underConstArea 업데이트를 본 적이 없었습니다.

내가 무슨 일이 일어나고 있는지 잘 모르겠지만 몇 가지 방법으로 해결할 수 있습니다.

먼저 $("#readyArea").on('change') 발생 여부는 브라우저에 따라 다릅니다. 이유는 모르겠지만 코드를 변경하면 Chrome에서 변경 이벤트가 발생하지 않는 것으로 보입니다. 어쩌면 그것은 무한 루프의 변화를 피하기 위해 노력 중일 것입니다. 나는 정말로 모른다.

번호가 완료되면 underConstArea 만 업데이트되면 (파이어 폭스처럼 동작하므로) change 대신 focusout에서 업데이트 할 수 있습니다. 귀하의 최우선을

$("#readyArea").on('focusout', function() { 
    $("#underConstArea").val($(this).val()); 
}); 

으로 변경했으며 Chrome과 Firefox에서 제대로 작동합니다. Here가 업데이트 된 바이올린입니다.

사용자가 입력 할 때마다 업데이트하려면 commaFormatted 함수 내에서 underConstArea을 업데이트하십시오. 기능 하단에

$("#underConstArea").val(amount); 

을 추가하면됩니다. 그리고 두 번째 옵션으로 link을 제안했습니다. #readyArea에 잡기 이벤트가 삭제되었습니다.