Search Results for '개발노트/Script/CSS/jQuery'

18 POSTS

  1. 2017.07.09 jQuery 자료
  2. 2012.11.12 윈도우 사파리에서 중국어, 일본어 글자가 깨지는 경우
  3. 2012.06.12 jQuery Ajax 에서 Struts 결과값을 Json 형태로 받아오기 (1)

jQuery 자료

Posted 2017. 7. 9. 23:41

1. 전자정부프레임웤(eGovFrame) 모바일 jQuery 가이드 

  http://m.egovframe.go.kr/mguide/guide/guide.do

2. jQuery기초 정리 및 예제

 http://androphil.tistory.com/241

3. jQuery selector 정리

 http://beone.tistory.com/610

4. jQuery 공식사이트 API

 http://api.jquery.com/





Write your message and submit

홈페이지를 구축하면서 영어/한국어/일본어/중국어를 각각 지원하도록 하는데, 브라우져별로 내용이 상이하게 나오는 경우가 허다하다.

전문 CSS 개발자는 쉽게 찾을 수 있는 문제겠지만 서버사이드 개발이나 디자인 개발을 주로하는 경우 난감해 질수 있으므로 정리해 보고자 한다.


특히 윈도우+사파리(safari)인 경우 제일 많이 깨지는 것을 경험하게 된다.

이런경우는 다음의 처리를 통해서 어느정도 글자가 깨지는것을 방지할수 있다.

우선 각 언어별로 css파일을 분리해야 한다. 이유는 폰트가 모든언어를 다 지원하지 않기 때문이다.


테스트1. 먼저 깨지는 화면에서 CSS를 모두 제거하고 브라우져에서 확인해보라. 이경우 깨지지 않고 정상으로 나온다면 이는 css에서 정의한 폰트가 해당 언어/브라우저에서 지원하지 않기 때문이다.

사파리의 경우 Mac+Safari에서는 아주 깔끔하게 처리되서 나오지만 Windows + Sarari는 중국어,일본어 심지어는 한국어까지 깨지는 경우도 있다. 

다음의 코드를 보자.


.news_body .news_list dl dd a:hover {color:#86500f;}

.news_body .news_list dl dd a span {font-family:"Malgun Gothic","Apple Gothic","Dotum","Tahoma","MS PGothic";}


이렇게 공통의 css파일을 처리해서 붙여넣게 된다. 이경우는 다음과 같이 분리해 보자.


각 폰트별로 제공하는 언어를 선별적으로 선택해서 적재하도록 분리하자.


위의 폰트는 언어별로 다음과 같이 분리했다.

영어는 모든 폰트에서 지원하는지 모르겠지만 중국어/일본어의 경우 지원폰트가 지극히 제한적일 수 있기 때문에 일반적인 경우처럼 폰트를 정의하는데, 특히 주의해야 할것으로 보인다.


Korean

{font-size:12px; font-family:"Malgun Gothic","Apple Gothic","Dotum","Nanum Gothic"; }


English

{font-size:12px; font-family:"Malgun Gothic","Apple Gothic","Dotum","Tahoma","MS PGothic";}


Chinese

{font-size:12px; font-family:"Tahoma","MS PGothic";}


Japan

{font-size:12px; font-family:"Tahoma","MS PGothic";}



Write your message and submit

jQuery를 이용해서 Ajax처리한 결과를 Json타입으로 받기

 

// 클라이언트 jQuery 코드

 

$.ajax({

type:"post", //http를 요청하는 방식 GET,POST뿐만 아니라  브라우저 지원에 따라 PUT, DELETE도 가능함.

async:true,

url:"login.do",

dataType :"json", //서버로 부터 전송받을 데이터의 타입(xml, json, html, script, JSONP, Text)

timeout: 1000,  //milliseconds

data : 'a='+a+'&b='+b,  // 서버로 전송할 파라메터 데이터.. $("#formId").serialize() 로도 가능

success : function(jsonData, textStatus, jqXHR){

alert(jsonData["result"]);},

error : function(jqXHR, textStatus, errorThrown){

alert(textStatus);

},

beforeSend:function(){

//ajax 요청 보내기 전 처리

},

complete:function(jqXHR, textStatus){

//ajax 완료후 처리

}

 

});

 

 

아래 서버측 코드는 스트러츠1을 이용한 방법이다. struts2에 대한 부분은 많은데, 1에 대한 부분은 없는듯 하다.

서버측 코드에서 Gson을 이용해서 json 데이터 보내기

 

        Map<String, Object> object1 = new HashMap<String ,Object>();
        object1.put("result", "성공");
        
        response.setContentType("application/json"); // 이 코드는 없어도 결과는 정상적으로 나옴.
        response.setCharacterEncoding("utf-8"); // 한글처리를 위해서 있어야 함.
       
        response.getWriter().write(new Gson().toJson(object1));

 

//text 형태는 setContentType 만 변경하고 데이터를 넘겨주면 끝.

 

response.setContentType("text");

response.getWriter().print("This is Text result");

 



  1. 김정우

    | 2018.08.07 18:54 | PERMALINK | EDIT | REPLY |

    이렇게되면 스트럿츠에서 forward는 어떻게 구성되어하나요...?

Write your message and submit
« PREV : 1 : 2 : 3 : 4 : ··· : 6 : NEXT »