Jquery.load_jquery로 페이지를 로드한 후 페이지 혼란에 대한 해결 방법-JS 튜토리얼-php.cn

Jquery.load_jquery로 페이지를 로드한 후 페이지 혼란에 대한 해결 방법

WBOY

풀어 주다： 2016-05-16 16:33:13

원래의

1747명이 탐색했습니다.

처음에는 Jquery를 이해하지 못했기 때문에 항상 jquery.load 메서드를 사용하여 부분 새로 고침을 달성하기 위해 새 페이지를 로드하고 싶었습니다. 로드된 페이지가 원래의 별도 페이지와 다르고, 스타일이 없어졌어요. 나중에 인터넷에서 찾아보니 다른 분의 답변이더군요.

그렇습니다. 일부 콘텐츠를 필터링하지 않고 직접 로드하면 페이지가 혼란스러워집니다. 예를 들어, 로드한 후에는 한 페이지의 body> 태그는 표준 HTML이 아닙니다. 이는 jquery.load() 함수에 지정됩니다. 일반적으로 로드된 페이지는 로드된 콘텐츠의 요소에 따라 CSS 스타일을 재정의하고 js 이벤트를 추가해야 합니다. 예:

원본 페이지 A.html:

<html>
<head><title></title></head>
<body>
<div id="container"></div>
</body></html>
被load的页面B.html：
<html>
<head><title></title></head>
<style>.page-li {font-size:12px;color:blue}</style>
<body>
<div id="page">
<ol class="page-li">
<li>234123</li><li>341234</li><li>41234</li><li>412de34</li>
</ol>
</div>
</body></html>

로그인 후 복사

원본 페이지 A.html에 호출된 jquery.load()를 로드한 다음 원본 페이지에서 page-li 스타일을 재정의합니다.

load(), CSS 원본 페이지 추가:

<html>
<head><title></title></head>
<style>.page-li {font-size:12px;color:green}</style>
<body>
<div id="container"></div>
<script type="text/javascript">
$(function(){
$("#container").load("B.html #page",null,function(){alert("加载成功")});
});
</script>
</body></html>

로그인 후 복사

도움이 되었기를 바랍니다