ajax에서 콘텐츠를 기본으로 표시하는 방법은 무엇입니까?

저는 히스토리를 지원하는 ajax 함수를 가지고 있지만 링크에서 페이지 내용을로드하려고합니다.ajax에서 콘텐츠를 기본으로 표시하는 방법은 무엇입니까?

여기에 내가 아약스 콘텐츠가 포함 된 세 개의 폴더가

<!DOCTYPE html> 
<html> 
<head> 
<title>demo</title> 
<script src="jquery.tools.min.js"></script> 
<link rel="stylesheet" type="text/css" href="tabs-no-images.css"/> 
</head> 
<body> 
<ul class="css-tabs"> 
    <li><a href="ajax1.htm">Tab 1</a></li> 
    <li><a href="ajax2.htm">Second tab</a></li> 
    <li><a href="ajax3.htm">An ultra long third tab</a></li> 
</ul> 

<div class="css-panes"> 
    <div style="display:block"></div> 
</div> 

<script> 
    $(function() { 
     $("ul.css-tabs").tabs(
     "div.css-panes > div", 
     {effect: 'ajax', history: true} 
    ); 
    }); 
</script> 
</body> 
</html>

내 index.html을

내 CSS를

/* root element for tabs */ 
ul.css-tabs { 
    margin:0 !important; 
    padding:0; 
    height:30px; 
    border-bottom:1px solid #666; 
} 

/* single tab */ 
ul.css-tabs li { 
    float:left; 
    padding:0; 
    margin:0; 
    list-style-type:none; 
} 

/* link inside the tab. uses a background image */ 
ul.css-tabs a { 
    float:left; 
    font-size:13px; 
    display:block; 
    padding:5px 30px; 
    text-decoration:none; 
    border:1px solid #666; 
    border-bottom:0px; 
    height:18px; 
    background-color:#efefef; 
    color:#777; 
    margin-right:2px; 
    position:relative; 
    top:1px; 
    outline:0; 
    -moz-border-radius:4px 4px 0 0; 
} 

ul.css-tabs a:hover { 
    background-color:#F7F7F7; 
    color:#333; 
} 

/* selected tab */ 
ul.css-tabs a.current { 
    background-color:#ddd; 
    border-bottom:1px solid #ddd; 
    color:#000; 
    cursor:default; 
} 


/* tab pane */ 
.css-panes div { 
    display:none; 
    border:1px solid #666; 
    border-width:0 1px 1px 1px; 
    min-height:150px; 
    padding:15px 20px; 
    background-color:#ddd; 
}

과 jquery.tools.min

입니다.

사용자가 페이지 index.html로 이동하면 원하는 페이지 (ajax1.htm 또는 ..)의 콘텐츠를 기본 콘텐츠로 볼 수 있습니다. 그래서 내 질문에 추가 코드를 추가하여 현재 코드로 어떻게 처리 할 수 있습니까?

편집 할 내용과 외부 코드 등을 배치 할 위치를 설명하십시오. 댓글에서

코드 :

$(function() { 
    var current_hash = false; 
    setInterval(function() { 
     if (window.location.hash != current_hash) { 
      current_hash = window.location.hash; 
      $('#content').load("ajax1.htm?page=" + current_hash); 
     } 
    }, 100); 
});

출처

2012-11-26 Avik

우리가 보여 주신 것을 보여 주시면 찾고있는 것을 이해하는 데 도움이 될 것입니다. ! 하여 setInterval (함수() { 경우 (하면 window.location.hash = current_hash) { current_hash =하면 window.location.hash; –

글쎄 $ (함수() { var에 current_hash = 거짓이 코드를 시도}, }); 이상한 – Avik

.......... 아무도 나를 도울 수 없다 !!!! 정말 우울해 .. – Avik

그런데 내가 내 문제의 해결책을 발견했다. 내가 jquery 주소 마스터를 사용하고 내 문제를 해결. 하지만 또 다른 문제가 발생했습니다. jquery conflict.
제가
Mootools의-유이 compressed.js (AJAX 어드레스 마스터 기능)
jquery.address-1.5.min.js (하나의 축 상에 고정되는 고정 된 메뉴 용)
JQuery와-UI- 사용 (AJAX 어드레스 마스터 기능) (AJAX 어드레스 마스터 기능) 1.8.13.custom.min.js
jquery.js

및 제 (Mootools의-유이 compressed.js)과 마지막 (JQuery와 .js)가 서로 충돌합니다. 내가 jQuery.noConflict();

을 시도했지만 작동하지 않았다.
도와주세요.

출처

2012-12-01 08:06:41 Avik

ajax에서 콘텐츠를 기본으로 표시하는 방법은 무엇입니까?

답변

관련 문제