Ajax php-страница и изменение URL-адреса при загрузке с помощью функции load () без обновления - PullRequest
Новая
       1

Ajax php-страница и изменение URL-адреса при загрузке с помощью функции load () без обновления

0 голосов
/ 03 июля 2018

Я недавно создаю сайт блога, и он основан на php версии 5.6.Теперь я застрял на неделе, чтобы добиться «загрузки страницы ajax, а также изменения URL при нажатии на навигацию без обновления всей страницы». Я следовал за многими предложениями от betoverflow и jQuery Forum. Но сам не сделал это должным образом. У меня есть меню с dropdown, а также атрибут dropdown-toggle данных. Иногда мой код работает нормально, но dropdown и dropdown-toggle не будут работать. Может ли кто-нибудь дать мне способ достичь этого. Я только начинающий Ajax. Вот мой код.

header.php 

        <?php
    require_once "../vendor/autoload.php";
     include "../lib/Database.php";
     include "../config/config.php";
     include "../helpers/Format.php";
    $fm= new Format();
    $db = new Database();
    $query ="SELECT * FROM `tbl_post` LIMIT 5";
    $post = $db->select($query);
    ?>
    <!doctype html>
    <html lang="en" xmlns="http://www.w3.org/1999/html">
    <head>
        <?php  include '../scripts/meta.php';?>
        <?php  include '../scripts/css.php';?>
    <?php include "../scripts/js.php";?>
    </head>
    <style>
        .row{
            margin:0;
        }
    </style>
    <body>
    <!-- header starts -->
    <header>
        <section id="smedia">
            <div class="container">
                <div class="row">
                    <div class="col-xs-12 col-sm-8 navbar-left">
                        <p><a href="../Template/contact.php">PHONE: 01971982959</a> </p>
                    </div>
                    <div class="col-sm-4">
                        <?php
                        $slgQuery = "SELECT * FROM `tbl_social` WHERE `id`= '1'";
                        $socialMedia = $db->select($slgQuery);
                        if($socialMedia )
                        {
                        while($socialResult = $socialMedia->fetch_assoc()) {
                        ?>
                        <a href="<?php echo $socialResult['fb']; ?>" target = "_blank"><i class="fa fa-facebook-official" aria-hidden="true"></i></a>
                        <a href="<?php echo $socialResult['tw']; ?>" target = "_blank"><i class="fa fa-twitter" aria-hidden="true"></i></a>
                        <a href="<?php echo $socialResult['pin']; ?>" target = "_blank"><i class="fa fa-pinterest-p" aria-hidden="true"></i></a>
                        <a href="<?php echo $socialResult['gplus']; ?>" target = "_blank"> <i class="fa fa-google-plus" aria-hidden="true"></i></a>
                        <a href="<?php echo $socialResult['ln']; ?>" target = "_blank"> <i class="fa fa-linkedin" aria-hidden="true"></i></a>
                        <?php
                        }
                        }
                        ?>
                    </div>
                </div>
            </div>
        </section>
        <!-- Navbar Starts -->
        <div class="row">
        <nav class="navbar navbar-default">
            <div class="container">
                <!-- Brand and toggle get grouped for better mobile display -->
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a class="navbar-brand" href="../Template/index.php">
                    <?php
                    $slgQuery = "SELECT * FROM `title_slogan` WHERE `id`= '1'";
                    $getTitle = $db->select($slgQuery);
                    if($getTitle)
                    {
                        while($slgResult = $getTitle->fetch_assoc())
                        {
                    ?>
                  <img src="../Dashboard/admin/<?php echo $slgResult['logo'];?>" alt="logo" class="img-responsive">
                            <?php
                        }
                    }
                    ?>
                    </a>
                </div>
                <!-- Collect the nav links, forms, and other content for toggling -->
                <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                    <ul class="nav navbar-nav navbar-right">
                        <?php
                        $path = $_SERVER['SCRIPT_FILENAME'];
                        $currentPage = basename($path,'.php');
                        ?>
                        <li <?php if($currentPage == 'index'){echo 'class ="active"';}?>><a  href="../Template/index.php">Home <span class="sr-only">(current)</span></a></li>

                        <li <?php if($currentPage == 'Excellent'){echo 'class ="active"';}?>>

                            <a   href="#" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Post<span class="caret"></span></a>

                            <ul class="dropdown-menu" aria-labelledby="dLabel">
                                <?php
                                if ($post){
                                while($result = $post->fetch_assoc())
                                {
                                ?>
                                <li><a href="../Template/Excellent.php?id=<?php echo $result['id'];?>"><p><?php echo $result['title'];?></p></a></li>
                                <?php }
                                }else{
                                    echo "data not Found!!";
                                }?>
                            </ul>

                        </li>
                          <?php
                         $aboutQuery = "select * from `tbl_page`";
                         $navigation = $db->select($aboutQuery);
                         if ($navigation)
                         {
                             while($aboutResult = $navigation->fetch_assoc())
                             {
                                 ?>

                        <li id="nav_link"
                            <?php if (isset($_GET['pageid'])&& $_GET['pageid']== $aboutResult['id'])
                            {
                                echo 'class ="active"';
                            }
                            ?>
                        > <a href="../Template/page.php?pageid=<?php  echo $aboutResult['id'];?>"><?php  echo $aboutResult['name'];?>
                            </a>
                        </li>
                                 <?php
                             }
                         }
                        ?>
                        <li <?php if($currentPage == 'contact'){echo 'class ="active"';}?> ><a href="../Template/contact.php">Contact</a></li>
                    </ul>
                </div><!-- /.navbar-collapse -->
            </div><!-- /.container-fluid -->
        </nav>
        </div>
        <!-- Navbar Ends -->
    </header>
    <!-- header ended -->

js.php 

 $('#nav_link li a').click(function (e) {
     e.preventDefault();
     var navPage=$(this).attr('href');
     // alert(navPage);
     $(document.body).load(navPage).fadeIn('slow');
     $('.dropdown-toggle').dropdown();
     if(navPage!==location.href){
         window.history.pushState({path:navPage},'',navPage);
     }
     return false;
 });

Любая помощь будет оценена или, пожалуйста, просветите меня. Спасибо в адвенсе

Обновление ЗДЕСЬ ОБНОВЛЕНИЕ

header.php 

        <?php
   // require_once "../vendor/autoload.php";
     include "../lib/Database.php";
     include "../config/config.php";
     include "../helpers/Format.php";
    $fm= new Format();
    $db = new Database();
    $query ="SELECT * FROM `tbl_post` LIMIT 5";
    $post = $db->select($query);
    ?>
    <!doctype html>
    <html lang="en" xmlns="http://www.w3.org/1999/html">
    <head>
        <?php  include '../scripts/meta.php';?>
        <?php  include '../scripts/css.php';?>
    </head>
    <style>
        .row{
            margin:0;
        }
    </style>
    <body>
    <!-- header starts -->
    <header>
        <section id="smedia">
            <div class="container">
                <div class="row">
                    <div class="col-xs-12 col-sm-8 navbar-left">
                        <p><a href="../Template/contact.php">PHONE: 01971982959</a> </p>
                    </div>
                    <div class="col-sm-4">
                        <?php
                        $slgQuery = "SELECT * FROM `tbl_social` WHERE `id`= '1'";
                        $socialMedia = $db->select($slgQuery);
                        if($socialMedia )
                        {
                        while($socialResult = $socialMedia->fetch_assoc()) {
                        ?>
                        <a href="<?php echo $socialResult['fb']; ?>" target = "_blank"><i class="fa fa-facebook-official" aria-hidden="true"></i></a>
                        <a href="<?php echo $socialResult['tw']; ?>" target = "_blank"><i class="fa fa-twitter" aria-hidden="true"></i></a>
                        <a href="<?php echo $socialResult['pin']; ?>" target = "_blank"><i class="fa fa-pinterest-p" aria-hidden="true"></i></a>
                        <a href="<?php echo $socialResult['gplus']; ?>" target = "_blank"> <i class="fa fa-google-plus" aria-hidden="true"></i></a>
                        <a href="<?php echo $socialResult['ln']; ?>" target = "_blank"> <i class="fa fa-linkedin" aria-hidden="true"></i></a>
                        <?php
                        }
                        }
                        ?>
                    </div>
                </div>
            </div>
        </section>
        <!-- Navbar Starts -->
        <div class="row">
        <nav class="navbar navbar-default">
            <div class="container">
                <!-- Brand and toggle get grouped for better mobile display -->
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a class="navbar-brand" href="../Template/index.php">
                    <?php
                    $slgQuery = "SELECT * FROM `title_slogan` WHERE `id`= '1'";
                    $getTitle = $db->select($slgQuery);
                    if($getTitle)
                    {
                        while($slgResult = $getTitle->fetch_assoc())
                        {
                    ?>
                  <img src="../Dashboard/admin/<?php echo $slgResult['logo'];?>" alt="logo" class="img-responsive">
                            <?php
                        }
                    }
                    ?>
                    </a>
                </div>
                <!-- Collect the nav links, forms, and other content for toggling -->
                <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                    <ul class="nav navbar-nav navbar-right nav_link">
                        <?php
                        $path = $_SERVER['SCRIPT_FILENAME'];
                        $currentPage = basename($path,'.php');
                        ?>
                        <li <?php if($currentPage == 'index'){echo 'class ="active"';}?>><a  href="../Template/index.php">Home <span class="sr-only">(current)</span></a></li>

                        <li <?php if($currentPage == 'Excellent'){echo 'class ="active"';}?>>

                            <a  href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Post<span class="caret"></span></a>
                            <ul class="dropdown-menu nav_link"  aria-labelledby="dLabel">
                                <?php
                                if ($post){
                                while($result = $post->fetch_assoc())
                                {
                                ?>
                                <li><a href="../Template/Excellent.php?id=<?php echo $result['id'];?>"><p><?php echo $result['title'];?></p></a></li>
                                <?php }
                                }else{
                                    echo "data not Found!!";
                                }?>
                            </ul>

                        </li>
                          <?php
                         $aboutQuery = "select * from `tbl_page`";
                         $navigation = $db->select($aboutQuery);
                         if ($navigation)
                         {
                             while($aboutResult = $navigation->fetch_assoc())
                             {
                                 ?>

                        <li
                            <?php if (isset($_GET['pageid'])&& $_GET['pageid']== $aboutResult['id'])
                            {
                                echo 'class ="active"';
                            }
                            ?>
                        > <a href="../Template/page.php?pageid=<?php  echo $aboutResult['id'];?>"><?php  echo $aboutResult['name'];?>
                            </a>
                        </li>
                                 <?php
                             }
                         }
                        ?>
                        <li <?php if($currentPage == 'contact'){echo 'class ="active"';}?> ><a href="../Template/contact.php">Contact</a></li>
                    </ul>
                </div><!-- /.navbar-collapse -->
            </div><!-- /.container-fluid -->
        </nav>
        </div>
        <!-- Navbar Ends -->
    </header>
    <!-- header ended -->

js.php 

   $('.nav_link li a').click(function (e) {
     e.preventDefault();
     var navPage= $(this).attr('href');
      //alert(navPage);
     $(document.body).load(navPage).fadeIn('slow');
     $(".dropdown-toggle").dropdown();
     if(navPage!==location.href){
         window.history.pushState({path:navPage},'',navPage);
     }
     return false;
 });

1 Ответ

0 голосов
/ 03 июля 2018

Very First удалите id="nav_link" из <li> и добавьте, а затем добавьте класс на <ul>

Я буду рекомендовать вам один класс и добавить на ваш оба <ul>

От: <ul class="nav navbar-nav navbar-right">

Кому: <ul class="nav navbar-nav navbar-right nav_link">

Также для звука <ul> Добавить тот же класс

Теперь измените в jquery

от: $('#nav_link li a').click(function (e) {

Кому: $('.nav_link li a').click(function (e) {

As # для Id и. для класса Подробнее об этом здесь: Селектор

Дополнительное обновление

Существует множество способов сделать это, но вы узнаете, какой из них полезен для текущего кода. вам нужно остановить код jquery, если в URL есть #, и это для почтового меню 

$('.nav_link li a').click(function (e) {
e.preventDefault();
var navPage= $(this).attr('href');
if(navPage != "#"){
    // your code
}
return false;
* +1039 *});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...