2016-10-07 1 views
1

클릭 버튼으로 PHP include ("link.html") 변경 방법.클릭 버튼으로 PHP include ("link.php") 변경

<?php include('link1.html')?> 
BUTTON 1 change <?php include('link1.html')?> to <?php include('link2.html')?> 
BUTTON 2 change <?php include('link1.html')?> to <?php include('link3.html')?> 
BUTTON 3 change <?php include('link1.html')?> to <?php include('link4.html')?> 

페이지를 새로 고치지 않고이를 수행하는 방법. 아약스 사용?

+0

link1.php에 HTML 콘텐츠가 포함되어 있습니까? HTML 컨텐트를 변경하려면 고유 ID가있는 div를 정의하고 내용은 ajax 호출을 사용하여 변경 될 수 있습니다. –

+0

예, 모든 PHP 파일에는 HTML 내용 만 들어 있습니다. 편집 : 확장자를 변경합니다. –

+0

@RahulPatel이해볼 게. –

답변

0

Wrap include('link1.html'); 고유 ID가있는 DIV. 그리고 버튼을 클릭하면 아약스를 호출하고 DIV 콘텐츠를 대체합니다.

아래 코드를 사용해보십시오.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<div id="DIVID"> 
    <?php 
     include('link1.html'); 
    ?> 
</div> 
<button onclick="btnclick('link2.html')">Button 1</button> 
<button onclick="btnclick('link3.html')">Button 2</button> 
<button onclick="btnclick('link3.html')">Button 3</button> 
<script type="text/javascript"> 
    function btnclick(_url){ 
     $.ajax({ 
      url : _url, 
      type : 'post', 
      success: function(data) { 
      $('#DIVID').html(data); 
      }, 
      error: function() { 
      $('#DIVID').text('An error occurred'); 
      } 
     }); 
    } 
</script> 
0
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<button onclick="include($(this))" value="2">Button 1</button> 
<button onclick="include($(this))" value="3">Button 2</button> 
<button onclick="include($(this))" value="4">Button 3</button> 
<div id="included_page"><?php include('link1.html')?></div> 

function include(elem) 
{ 
    var page = elem.val(); 
    $.ajax({ 
    url: "link" + page + ".html", 
    type: "GET" 
    }).done(function(msg) { 
    $('#included_page').html(msg); 
    }) 
    }) 
} 

아약스에서는별로 좋지 않지만 문제가 발생하는 경우이 라인을 따라 가면 문제가 발생할 수 있습니다.

1

당신은 할 수 JQuery와 예와 :

PHP 코드 :

<div id="mainDiv"><?php include('link1.html')?></div> 
<button onclick="change2()">Button 1</button><br /> 
<button onclick="change3()">Button 2</button><br /> 
<button onclick="change4()">Button 3</button><br /> 

jQuery 코드

function change2() { 
    $('#mainDiv').load('link2.html'); 
} 

function change3() { 
    $('#mainDiv').load('link3.html'); 
} 

function change4() { 
    $('#mainDiv').load('link4.html'); 
} 

드를 포함하는 것을 잊지 마세요 JQuery

<script src="jquery/jquery.min.js"></script>