ajax 탭 질문드려요 채택완료
오늘도화이팅
6년 전
조회 2,253
아래 구글링해서 찾은 ajax 예제인데요
제가 여기서 궁금한게 a태그에 page_1 ~ page_3.html을 넣는 방식으로 보여서요
혹시 해당 탭을 최신글로 사용하기 위해서는
page_1.html,
page_2.html.
page_3.html 파일을 전부 만들어서 안에 최신글 스킨을 넣어주면 되는건가요?
</p>
<p><code><ul id="nav"></code></p>
<p><code> </code><code><li><a href="page_1.html">Page 1</a></li></code></p>
<p><code> </code><code><li><a href="page_2.html">Page 2</a></li></code></p>
<p><code> </code><code><li><a href="page_3.html">Page 3</a></li></code></p>
<p><code></ul></code></p>
<p> </p>
<p><code><div id="ajax-content">This is default text, which will be replaced</div></code></p>
<p> </p>
<p> </p>
<p><code>$(document).ready(</code><code>function</code><code>() {</code></p>
<p><code> </code><code>$(</code><code>"#nav li a"</code><code>).click(</code><code>function</code><code>() {</code></p>
<p> </p>
<p><code> </code><code>$(</code><code>"#ajax-content"</code><code>).empty().append(</code><code>"<div id='loading'><img src='images/loading.gif' alt='Loading' /></div>"</code><code>);</code></p>
<p><code> </code><code>$(</code><code>"#nav li a"</code><code>).removeClass(</code><code>'current'</code><code>);</code></p>
<p><code> </code><code>$(</code><code>this</code><code>).addClass(</code><code>'current'</code><code>);</code></p>
<p> </p>
<p><code> </code><code>$.ajax({ url: </code><code>this</code><code>.href, success: </code><code>function</code><code>(html) {</code></p>
<p><code> </code><code>$(</code><code>"#ajax-content"</code><code>).empty().append(html);</code></p>
<p><code> </code><code>}</code></p>
<p><code> </code><code>});</code></p>
<p><code> </code><code>return</code> <code>false</code><code>;</code></p>
<p><code> </code><code>});</code></p>
<p><code>});</code></p>
<p> </p>
<p> </p>
<p><code>$(document).ready(</code><code>function</code><code>() {</code></p>
<p><code> </code><code>$(</code><code>"#nav li a"</code><code>).click(</code><code>function</code><code>() {</code></p>
<p> </p>
<p><code> </code><code>$(</code><code>"#ajax-content"</code><code>).empty().append(</code><code>"<div id='loading'><img src='images/loading.gif' alt='Loading' /></div>"</code><code>);</code></p>
<p><code> </code><code>$(</code><code>"#nav li a"</code><code>).removeClass(</code><code>'current'</code><code>);</code></p>
<p><code> </code><code>$(</code><code>this</code><code>).addClass(</code><code>'current'</code><code>);</code></p>
<p> </p>
<p><code> </code><code>$.ajax({ url: </code><code>this</code><code>.href, success: </code><code>function</code><code>(html) {</code></p>
<p><code> </code><code>$(</code><code>"#ajax-content"</code><code>).empty().append(html);</code></p>
<p><code> </code><code>}</code></p>
<p><code> </code><code>});</code></p>
<p><code> </code><code>return</code> <code>false</code><code>;</code></p>
<p><code> </code><code>});</code></p>
<p> </p>
<p><code> </code><code>$(</code><code>"#ajax-content"</code><code>).empty().append(</code><code>"<div id='loading'><img src='images/loading.gif' alt='Loading' /></div>"</code><code>);</code></p>
<p><code> </code><code>$.ajax({ url: </code><code>'page_1.html'</code><code>, success: </code><code>function</code><code>(html) {</code></p>
<p><code> </code><code>$(</code><code>"#ajax-content"</code><code>).empty().append(html);</code></p>
<p><code> </code><code>}</code></p>
<p><code> </code><code>});</code></p>
<p><code>});</code></p>
<p>
댓글을 작성하려면 로그인이 필요합니다.
답변 2개
채택된 답변
+20 포인트
답변에 대한 댓글 4개
�
오늘도화이팅
6년 전
e
eyekiss
6년 전
보안이 걱정되시면 사이트 전체에 ssl 을 적요하시구요..
ajax 로 했다고 특별히 보안이 더 안좋고 그런건 없습니다.
php 연결이라는거는 파일 확장자인가요?
page_1.php 파일로 저장하고 연결해도 됩니다.
ajax 로 했다고 특별히 보안이 더 안좋고 그런건 없습니다.
php 연결이라는거는 파일 확장자인가요?
page_1.php 파일로 저장하고 연결해도 됩니다.
�
오늘도화이팅
6년 전
php 확장자를 연결하려면
아래부분처럼 append부터 url를 .php로 변경처리해주면 되나요?!
$.ajax({ url: 'page_1.phpl', success: function(php) {
$("#ajax-content").empty().append(php);
아래부분처럼 append부터 url를 .php로 변경처리해주면 되나요?!
$.ajax({ url: 'page_1.phpl', success: function(php) {
$("#ajax-content").empty().append(php);
e
eyekiss
6년 전
넵.. 당연히 파일명을 동일하게 맞춰야죠..
댓글을 작성하려면 로그인이 필요합니다.
6년 전
index.php--------------------------------------------
</p>
<p><div id="test" style="height : 300px; border : solid 1px red;"></div></p>
<p>$(document).ready(function(){
$.ajax({
url:'ajaxfile.php', // 여기에 latest()함수가 실행될 php파일 경로를 입력해주세요 (따로 만들어주셔야함)
type : 'post',
success : function(data){
$("#test").append(data);
}
})
});</p>
<p>-------------------------------------------
ajaxfile.php------------------
</p>
<p><?php
include_once('../common.php'); //common.php경로는 ajaxfile.php의 경로에 따라 다릅니다.
include_once(G5_LIB_PATH.'/latest.lib.php');</p>
<p>echo latest('basic', 'gallery');
?></p>
<p>-----------------------------------
skin/latest/basic/latest.skin.php--------------------------
</p>
<p><?php</p>
<p>add_stylesheet('<link rel="stylesheet" href="'.$latest_skin_url.'/style.css">', 0);//이구문 삭제 후</p>
<p>?></p>
<p><link rel="stylesheet" href="<?php echo $latest_skin_url?>/style.css"> //php 코드 밖에 태그로 스타일 시트 불러와주세요</p>
<p>------------------------
해본결과 잘 출력되는데 파일위치나 이런게 조금 다를테니 그것만 잘 찾아서 경로 설정해주면 될것같습니다
로그인 후 평가할 수 있습니다
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인
궁금한게 있는데요..! 혹시 위에 아작스방식으로 최신글을 사용할경우
보안적인부분에서 문제가 될수있을까요?! (기본최신글 기준)
html이 아닌 php로 연결하려면 어디부분을 봐야할까요?!