왜 JQuery와 모바일에서 index.html을 모든 스크립트를 넣어 가지고

해결법

1.이 문서는 또한 내 블로그의 한 부분으로 여기에서 찾을 수 있습니다.

이 문서는 또한 내 블로그의 한 부분으로 여기에서 찾을 수 있습니다.

당신이 jQuery를 모바일 작동 방식을 이해하기 위해 필요한이 상황을 이해합니다. 그것은 다른 페이지를로드하는 아약스 사용합니다.

첫 페이지는 일반적으로로드됩니다. 그것의 머리와 몸은 DOM에로드, 그들은 await를 다른 콘텐츠에있다. 두 번째 페이지가로드되면에만 BODY 내용은 DOM에로드됩니다. 더 정확히 말하면, 심지어 몸은 완전히로드되지 않습니다. 속성 데이터 역할 = "페이지"만 첫번째 사업부가로드됩니다, 다른 모든 폐기 될 것입니다. 당신이 BODY 내부 페이지가 더하더라도 단지 첫 번째로드 할 것입니다. 당신이 그들 모두가로드됩니다 초기 HTML에서 더 많은 페이지가있는 경우이 규칙은, 다음 페이지에 적용됩니다.

의 당신의 버튼을 성공적으로 보여하지만 이벤트가 작동하지 않는 클릭 이유. 부모가 HEAD 페이지 전환하는 동안 무시되었다 같은 클릭 이벤트.

여기에 공식 문서는 다음과 같습니다 http://jquerymobile.com/demos/1.2.0/docs/pages/page-links.html

불행하게도이 자신의 문서에 설명 된 찾을하지 않을 수 있습니다. 에테르 그들은 이것이 상식이라고 생각하거나 내 다른 주제처럼이를 설명하는 잊어 버렸습니다. (jQuery를 모바일 문서는 크지 만 많은 것들을 부족)입니다.

두 번째 페이지 및 다른 모든 페이지에서 다음과 같이 본문 내용으로 SCRIPT 태그를 이동 :
```
<body>
    <div data-role="page">
        // And rest of your HTML content
        <script>
            // Your javascript will go here
        </script>
    </div>
</body>
```
이것은 빠른 해결책하지만 여전히 추한 하나입니다.

작동 예 여기 내 다른 대답에서 찾을 수 있습니다 :의 pageshow changepage 후 트리거되지

또 다른 작업 예 : 페이지 jQuery를 모바일 전환 다르게로드

원래 처음 HTML로 자바 스크립트의 모든 이동합니다. 수집 모든과 HEAD로, 하나의 js 파일 안에 넣어. jQuery를 모바일가로드 된 후를 초기화합니다.
```
<head>
    <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=no; target-densityDpi=device-dpi"/>
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
    <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>    
    <script src="index.js"></script> // Put your code into a new file
</head>
```
이 좋은 솔루션의 일부가 왜 결국 나는 설명 할 것이다.

사용 REL = 당신의 버튼 및 변경 페이지에 사용하는 모든 요소에서 "외부". 그것 때문에 아약스는 일반적인 웹 응용 프로그램처럼 작동합니다 페이지 로딩와 jQuery를 모바일 앱 사용하지 않을. 불행하게도 이것은 귀하의 경우 좋은 해결책이 아니다. 폰갭은 일반 웹 응용 프로그램으로 작동해서는 안됩니다.
```
<a href="#second" class="ui-btn-right" rel="external">Next</a>
```
공식 문서, 장에 보면 : 아약스없이 연결

현실적인 솔루션은 솔루션 (2)을 사용하지만 솔루션이 달리, 그 같은하는 index.js 파일을 사용하고 모든 가능한 다른 페이지의 HEAD 내부를 초기화합니다.

왜 지금 당신은 저를 요청할 수 있습니다?

jQuery를 모바일과 같은 폰갭은 버그이며, 조만간 당신의 모든 JS 콘텐츠를 하나의 HTML 파일 내부에있는 경우 (로드 DOM 포함)이 오류가 될 것와 앱이 실패합니다. DOM은 삭제 될 수 있으며 폰갭은 현재 페이지를 새로 고침합니다. 해당 페이지는 자바 스크립트가없는 경우는 그 때까지 작업이 다시 시작되지 않습니다.

이 문제는 쉽게 좋은 페이지 구조로 고정 할 수 있습니다. 사람이 관심이 있다면 나는 좋은 jQuery를 모바일 페이지 아키텍처에 대한 기사를 썼다. 너트 쉘에서 내가 jQuery를 모바일 작동하는 방법의 지식을 논의하고 당신은 당신이 성공적으로 당신에게 첫 번째 응용 프로그램을 작성하기 전에 알아야 할 가장 중요한 일이다.
2.페이지 사이를 탐색 할 때 정상적인 보통의 HTML 페이지와는 달리, jQuery를 모바일 아약스 기술을 사용합니다. 그래서 모든 HTML 페이지에서 모든 JS 파일 및 라이브러리를 가져올 수 있는지 확인하십시오.

페이지 사이를 탐색 할 때 정상적인 보통의 HTML 페이지와는 달리, jQuery를 모바일 아약스 기술을 사용합니다. 그래서 모든 HTML 페이지에서 모든 JS 파일 및 라이브러리를 가져올 수 있는지 확인하십시오.

당신이 자세히 알 경우에 당신은 두 번째 페이지를로드 할 때 이전 페이지에서 JS 파일을 고려할 것을 볼 수 있습니다. 현재 페이지를 rrefresh 강제한다면 다음 현재 페이지의 JS 파일이 유효합니다.

앞서 메이크업 말했다 그래서 반드시 모든 HTML 파일에 JS 파일을 가져옵니다.

또한 필요는 페이지의 특정 JS 함수를 호출 할 deviceready 사용 다음 구문을 호출하지합니다
```
$(document).on('pageshow', '#YourPageID', function(){
    // Your code goes here
});
```
3.JQuery와 모바일은 "페이지"로드 아약스 사용합니다. A "페이지"여기에 데이터 역할 = 페이지와 사업부입니다. 당신은 물리적 페이지 index.html을로드하면 해당 페이지 내부에 "페이지"DIV에 changePage를 사용하여 탐색 할 수 있습니다.

JQuery와 모바일은 "페이지"로드 아약스 사용합니다. A "페이지"여기에 데이터 역할 = 페이지와 사업부입니다. 당신은 물리적 페이지 index.html을로드하면 해당 페이지 내부에 "페이지"DIV에 changePage를 사용하여 탐색 할 수 있습니다.

다른 물리적 페이지에서 "페이지"를로드 할 경우, JQM은 해당 페이지에서 최초의 "페이지"사업부를로드합니다. 무엇 실제로 발생하면, JQM 그냥 Ajax를 사용하여 특정 "페이지"사업부를로드 페이지를 변경하고 현재 페이지에 주입하지 않는 것입니다.

당신은 거기에서 두 가지 당신이 HTML 페이지에서 모든 "페이지"를 넣어 아키텍처와 탐색이있다. 또는 여러 페이지의 구조를 가질 수있다. 당신은 항상이를 혼합 할 수 있습니다.

물리적 페이지를 변경하려면 링크에 외부 확인해를 = 추가해야합니다.

from https://stackoverflow.com/questions/15800121/why-i-have-to-put-all-the-script-to-index-html-in-jquery-mobile by cc-by-sa and MIT license

'JQUERY' 카테고리의 다른 글

[JQUERY] 크로스 도메인 iframe의 DOM의 컨텐츠를 가져 오기 [중복] (0)	2020.09.29
[JQUERY] A는 CSS로 메뉴를 <선택>에서 어떻게 <옵션>을 숨기려면? (0)	2020.09.29
[JQUERY] jQuery를 사용하여 - 제출에서 양식을 방지 (0)	2020.09.29
[JQUERY] 방법은 iframe에 'X 프레임 - 옵션'을 설정하는 방법? (0)	2020.09.29
[JQUERY] 이름 속성에 대괄호와 입력에 대한 jQuery를 선택 (0)	2020.09.29

복붙노트

[JQUERY] 왜 JQuery와 모바일에서 index.html을 모든 스크립트를 넣어 가지고

왜 JQuery와 모바일에서 index.html을 모든 스크립트를 넣어 가지고

해결법

1.이 문서는 또한 내 블로그의 한 부분으로 여기에서 찾을 수 있습니다.

2.페이지 사이를 탐색 할 때 정상적인 보통의 HTML 페이지와는 달리, jQuery를 모바일 아약스 기술을 사용합니다. 그래서 모든 HTML 페이지에서 모든 JS 파일 및 라이브러리를 가져올 수 있는지 확인하십시오.

'JQUERY' 카테고리의 다른 글

티스토리툴바