Включить PHP, Загрузка страницы с помощью ajax (без обновления страницы)

Question

Я новичок здесь, поэтому я хочу быть более конкретным, насколько это возможно. XD хорошо, давайте начнем:

Я создал шаблон с div + css, и с php я создал скрипт, который включает в себяфайл, который вы вызываете из меню Ссылки с "index.php? modul = modulename" это код:

<div id="contenuto"><br />
<?php
if(empty($_GET["modul"]) && empty($_GET['userpanel'])) {
        require('moduli/news.php');
            }
        elseif (file_exists("moduli/" . $_GET['modul'] . ".php")) {
        include("moduli/" . $_GET['modul'] . ".php");}
         elseif (file_exists("moduli/userpanel/" . $_GET['userpanel'] . ".php")) {
        include("moduli/userpanel/" . $_GET['userpanel'] . ".php");
       }else{
      include("moduli/404.php");
    }
?>
<br />
</div>

Итак ... я хотел бы, чтобы при нажатии на ссылку меню он включалконкретный модуль без обновления страницы ... извините за мой плохой английский xD

Answer 1

Допустим, это список ссылок вашего меню:

<ul id="menulist">
  <li><a href="index.php?modul=mod1" rel="mod1">Module 1</a></li>
  <li><a href="index.php?modul=mod2" rel="mod2">Module 2</a></li>
  <li><a href="index.php?modul=mod3" rel="mod3">Module 3</a></li>
  <li><a href="index.php?modul=mod4" rel="mod4">Module 4</a></li>
  <li><a href="index.php?modul=mod5" rel="mod5">Module 5</a></li>
</ul>

Вы можете достичь того, что вам нужно, с помощью простого запроса jquery и другого php-файла «module-rener»:

<script>
    $(document).ready(function(){
        $('#menulist li a').click(function(e){
            e.preventDefault(); // This will prevent the link to work.
            $('#contenuto').load('module_bringer.php?mod=' +  $(this).attr('rel'););  // You get the moule from rel attribute
            // You should keep the actual link so bots can crawl.
        });
    });
</script>

Подробное объяснение Править ниже

0 - ОК.Прежде всего вы должны заставить все работать без js и jquery.Боты не сканируют браузер, они просто берут исходный код и сканируют код.(Предполагая, что вы заботитесь о SEO)

1 - Создайте дополнительный атрибут для ссылок меню (в этом случае я добавил атрибут rel).Значение этого атрибута является значением параметра модуля.

2 - Включить библиотеку jquery (если вы не включили ранее - вы можете скачать ее с здесь .

3 - Вы можете использовать вторую часть кода, которую яВы просто должны изменить триггерную часть. В коде jquery $('#menulist li a').click срабатывает, когда объясняются пункты меню, которые находятся в первом блоке кода. Вы должны изменить это в соответствии со своей структурой меню. Эта частьэто делает httprequest и помещает результаты в #contenuto div.

4 - Вам нужно создать еще один файл для включения контента, который будет целевым файлом jquery httprequest. (в данном случае я назвалэто module_bringer.php). Содержание должно быть таким:

<?php
    // You probably need to include some files here like db connection, class definitions etc.
?>
<br />
<?php
if(empty($_GET["modul"]) && empty($_GET['userpanel'])) {
        require('moduli/news.php');
            }
        elseif (file_exists("moduli/" . $_GET['modul'] . ".php")) {
        include("moduli/" . $_GET['modul'] . ".php");}
         elseif (file_exists("moduli/userpanel/" . $_GET['userpanel'] . ".php")) {
        include("moduli/userpanel/" . $_GET['userpanel'] . ".php");
       }else{
      include("moduli/404.php");
    }
?>
<br />

Answer 2

Для достижения новой функциональности без обновления страницы вам нужно будет использовать ajax.Я рекомендую использовать библиотеку jQuery .

Вам необходимо будет вызывать такие функции, как jQuery.ajax или load .Обе функции принимают URL в качестве первого аргумента, который может быть страницей PHP.

Answer 3

Вы хотите, чтобы ссылки выглядели как <a href="#" onClick="getPage(module_name)>link text</a>.Замените module_name именем модуля, которое вы хотите получить для каждой ссылки.Ajax полностью посвящен javascript `xmlHttpRequest '.

function getPage(modul){

    // This will create the XmlHttpRequest in modern browsers
    if(window.XMLHttpRequest){
        xmlhttp=new XMLHttpRequest();                   
    }
    // This will create the XmlHttpRequest in older versions of Internet Explorer
    else{
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }

    // This is how you tell the script what to do with the response from the request
    xmlhttp.onreadystatechange=function()
    {
        if(xmlhttp.readyState==4 && xmlhttp.status==200)
        {
            document.getElementById("contenuto").innerHTML=xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET", "moduli.php?modul="+modul, true);
    xmlhttp.send();
}

В этом примере вам потребуется еще один файл, moduli.php, чтобы получить запрос xmlhttp и включить правильный файл.Это может выглядеть примерно так.

$modul = $_GET['modul'];

include('moduli/'.$modul.'.php');

Это первый способ сделать это через AJAX, который приходит на ум, но я не ветеран, так что, вероятно, есть гораздо более простой способ сделать это.

Редактировать: Другие люди ответили гораздо более простыми способами сделать это с помощью jQuery, поэтому я рекомендую взглянуть на это.Единственным преимуществом моей версии является то, что вам не нужно звонить, чтобы включить библиотеку (даже если это просто).