Peep

jquery form.serialize(); 시 checkbox 값 ajax 전송되지 않는 이슈

따로 작업해서 넣어줘야하는것을 알게되었음..

HTML

<form id="formId">
  <input id="checkboxId" name="checkboxName" type="checkbox" />
  <input type="text" />
</form>

JS

$.ajax({
  url: "url입력",
  dataType: 'json',
  data: form.serialize(),
  success: function (data) {
  	if(data.retcode === 100) alert('성공');
  }
});

JS

var $chk = $('#checkboxId');
var formData = $('#formId').serializeArray();

if(!$chk.is(':checked')){
  formData.push({
    name : $chk.attr('name'),
    value : false
  });	
}

<input type="text" placeholder="이름을 입력해주세요.">

JS

<script type="text/javascript" src="/public/javascripts/jquery.min.js"></script>
<script type="text/javascript" src="/public/javascripts/lib/jquery.placeholder.min.js"></script>
<script>

  (function ($) {
      // 이런식으로 쓰면 된다.
      $('input, textarea').placeholder();
  })(jQuery);
  
</script>

https://github.com/mathiasbynens/jquery-placeholder

https://okayoon.tistory.com/entry/fingerprintjs-%EB%B8%8C%EB%9D%BC%EC%9A%B0%EC%A0%80-%EC%A7%80%EB%AC%B8

<script type="text/javascript" src="/public/javascripts/jquery.min.js"></script>

// 브라우저 분기
<!--[if !IE ]> -->
<script type="text/javascript" src="/public/javascripts/lib/fingerprint2.js"></script>
<!-- <![endif]-->
<!--[if gt IE 8]>
<script type="text/javascript" src="/public/javascripts/lib/fingerprint2.js"></script>
<![endif]-->

<script>
  // fingerprint2.js
  (function() {
    var $input = $('#fingerPrintKey');
    if($input.length < 1) return false;

    // 브라우저 분기2 (ie8 이하일때 지원 불가 예외 처리...)
    (브라우저 ie이면) ? $input.parent().hide() : getFingerPrintCode();

    function getFingerPrintCode(){
      var fingerPrint = new Fingerprint2();
      
      fingerPrint.get(function (code) {
      	$input.val(code);
      })
    }
  })();
</script>

+ 이슈 추가

IE11에서 듀얼모니터일 경우 2번 모니터로 볼 경우 주 모니터(1번 모니터)의 값만 받아오는 현상.

fringerprint2.js에서 해상도를 어떻게 가져오는지를 먼저 파악하기위해 js파일의 라인428에 있는 getScreenResolution 메서드를 확인해봤는데, window.screen을 통해 모니터의 해상도를 구하고 있었다.

이것을 토대로 검색을 해본 결과 IE11 브라우저 버그인 것 같다.

IE11에서는 주 모니터의 옵션만 가져오는 것으로 보인다.

window.screen 테스트

크롬, 엣지

1번 모니터

2번 모니터

각각 다른 widtn, height값을 확인할 수 있다.

IE11

1번 모니터

2번 모니터

동일한 값을 확인할 수 있고, 이 값이 주모니터의 값이란 것을 확인할 수 있다.

- 전각 숫자를 반각 숫자로 변경
String.prototype.toHalfWidth = function(){
    return this.replace(/[！-～]/g, function(r){ // replace의 정규식은 요구사항에 맞추어 변경가능
        return String.fromCharCode(r.charCodeAt(0) - 0xFEE0);
    });
};

var result = '０００'.toHalfWidth();
console.log(result); // 000

- 숫자외에 입력 불가
result = result.replace(/\s|\D/g, '');

- 4자리씩 끊어서 한칸 띄고 작성
result = result.replace(/(\d{4})\B/g, '$1 ');

//여기서 $1은 첫번째 괄호값이라고 한다($1~$9까지 9개를 저장할 수 있다고)
// MSDN 참조 링크 : https://msdn.microsoft.com/ko-kr/library/24th3sah(v=vs.94).aspx
// 정규표현식 테스트 사이트 https://regexr.com/​

전각 반각 테스트 방법

 

 

화면 왼쪽 하단 윈도우 아이콘 마우스 우 클릭해서 제어판 오픈

 

or

 

윈도우키 + R 누르면 실행창 뜨는데, 거기서 control 입력 후 확인 눌러도 제어판 오픈 됨.

 

 

 

 

보기 기준 '범주' 에서 

시계, 언어 및 국가별 옵션 > 언어 추가

 

 

언어 추가 클릭

 

 

언어 추가 창에서 오른쪽 상단에 추가 언어 검색

'일본어' 입력 하면 추가 화면에 뜨는 것 확인 가능.

 

추가

 

 

추가하면 확인 가능한게 2가지있음.

첫번째는 언어 기본 설정 변경에 추가 된 언어가 보임

두번째는 오른쪽 하단에 시계 옆 쪽으로 Microsoft 입력기가 생김.

 

 

---

 

전각/반각 설정법

 

 

확대하면 이렇게!

마우스 클릭 또는 Windows키+space키 하면 언어 전환 가능

 

 

그 옆 'A'로 뜨거나 '가'로 뜨거나... 전환키가 뜨는데

여기서 전각/ 반각 확인 가능함.

한글일땐 전/반자 이라 써있고 일본어 일땐 저렇게 나타나는데 Full-width가 전각임

 

 

구글창에서 확인해보면 

앞쪽에 얇아보이는 글이 반각이고

하단에 밑줄있는게 전각임.

 

 

+(Windows 10에서 하는 방법)

 

 

윈도우 아이콘 클릭 후 설정 클릭(톱니바퀴 아이콘)

 

 

windows 설정에서 시간 및 언어 클릭

 

 

언어 영역이 보이면

 

 

언어 추가 클릭

 

 

설치할 언어 검색 후 클릭 > 다음

 

 

해당 언어 기능 옵션 선택 후 설치

(예시 : 음성 체크 -> 음성도 같이 설치)

 

 

 

화살표로 순서 변경 가능, 제거 가능.

다시 시작하면 됨.

 

그 다음엔 위에 전각/반각 설정법 참고