Javascript 使用Jquery/Ajax将页面加载到Div中（单击函数不工作）_Javascript_Php_Jquery_Html_Ajax

Javascript 使用Jquery/Ajax将页面加载到Div中（单击函数不工作）

javascript php jquery html ajax

Javascript 使用Jquery/Ajax将页面加载到Div中（单击函数不工作）,javascript,php,jquery,html,ajax,Javascript,Php,Jquery,Html,Ajax,尝试从其他页面获取内容，以便在单击时从url加载到特定Div。但由于某种原因，它不会起作用。链接一直转发到页面，而不是在div中打开。最重要的是，初始加载代码起作用。它加载初始内容。当我点击带有所需内容的链接时，设置一个警报通知我，它会发送警报。然后我把返回值设为假；最后，现在它不加载任何内容。我做错了什么。我正在使用一年前在这里使用的代码。但现在它在我的新网站上不起作用了。请帮助我确定如何修复此问题以下是我的AJAX代码： $(document).ready(function () { $

尝试从其他页面获取内容，以便在单击时从url加载到特定Div。但由于某种原因，它不会起作用。链接一直转发到页面，而不是在div中打开。最重要的是，初始加载代码起作用。它加载初始内容。当我点击带有所需内容的链接时，设置一个警报通知我，它会发送警报。然后我把返回值设为假；最后，现在它不加载任何内容。我做错了什么。我正在使用一年前在这里使用的代码。但现在它在我的新网站上不起作用了。请帮助我确定如何修复此问题

以下是我的AJAX代码：

$(document).ready(function () {
$('#main').load('pages/home.php');

    $('ul#navMenu li a').click(function() {
        var page = $(this).attr('href');
        $('main').load('pages/' + page + '.php');
        return false;
    }); 

});

这是我的HTML：

<body class="">
    <div class="container">
        <div class="menu-wrap">
            <nav class="menu">
                <div class="link-list">
                    <center>
                    <ul id="navMenu">
                    <li><a href="pages/home.php"><span>HOME</span></a></li>
                    <li><a href="pages/artist.php"><span>TALENT</span></a></li>
                    <li><a href="#"><span>SERVICES</span></a></li>
                    <li><a href="#"><span>MUSIC</span></a></li>
                    <li><a href="#"><span>BEATS</span></a></li>
                    <li><a href="#"><span>VIDEOS</span></a></li>
                    <li><a href="#"><span>CONTACT US</span></a></li>
                    </ul>
                    </center>
                </div>

            </nav>
        </div>
        <button class="menu-button" id="open-button"><img src="img/menubutt.png" height="42" width="42"><span>Open Menu</span></button>
        <div class="content-wrap">
            <div id="main">

            </div>
        </div><!-- /content-wrap -->
    </div><!-- /container -->
    <script src="js/jquery-3.2.1.min.js"></script>
 <script src="js/bootstrap.min.js"></script>
<script src="js/ajax.js"></script>
    <script src="js/classie.js"></script>
    <script src="js/main.js"></script>











打开菜单

下面是在我的服务器上测试的网站：

尝试更改

$（'main'）.load（'pages/'+page+'.php'）
到
$（'#main'）.load（'pages/'+page+'.php'）
您忘记了
main
开头的
尝试更改
$（'main'）.load（'pages/'+page+'.php'）
到
$（'#main'）.load（'pages/'+page+'.php'）
您忘记了#
在main
开头的
，请尝试更正页面上的url变量和主要键入错误：
$(document).ready(function () {
$('#main').load('pages/home.php');

    $('ul#navMenu li a').click(function() {
        var page = $(this).attr('href');//your href attribute is '#', which doesn't yield a correct path
        $('#main').load('pages/' + page + '.php');//$('#main') instead of $('main'), for id
        return false;
    }); 

});

请尝试更正页面变量上的url以及您的主要打字错误：
$(document).ready(function () {
$('#main').load('pages/home.php');

    $('ul#navMenu li a').click(function() {
        var page = $(this).attr('href');//your href attribute is '#', which doesn't yield a correct path
        $('#main').load('pages/' + page + '.php');//$('#main') instead of $('main'), for id
        return false;
    }); 

});

看来我找到了你犯错的真正原因
查看您的链接
更准确地说，在home.php

在你的JS中，你得到了完整的链接，例如pages/home.php
，然后你再添加一次.php
，因此你的最后一个链接是pages/home.php.php
，而不是pages/home.php
，看起来我找到了你错误的真正原因
查看您的链接
更准确地说，在home.php

在你的JS中，你会得到完整的链接，例如pages/home.php
，然后你再添加一次.php
，因此你的最终链接是pages/home.php.php
，而不是pages/home.php
，尝试替换$（'ul#navMenu li a'）。点击（函数（）{/code>和$（'ul navMenu#导航菜单”）。点击（“点击”，“li a”，函数（事件）{event.preventDefault（）；
@rulisp这不起作用，它只是在同一个窗口中打开页面，而不是在分区中尝试消除javascript错误，它在控制台上说找不到我已经纠正了这一点，仍然是一样的result@TrillumonopolyInc顺便说一句，不确定这是一个原因，但您的站点也会抛出错误（在控制台中）未捕获错误：引导下拉列表需要Popper.js(https://popper.js.org)
尝试替换$（'ul#navMenu li a'）。用$（'ul#navMenu'）单击（函数（）{
）。在（“单击”，“li a”，函数（事件）{event.preventDefault（）
@rulisp这不起作用，它只是在同一个窗口中打开页面，而不是在div中尝试消除javascript错误，它在控制台上说找不到我已经纠正了这一点，但仍然是一样的result@TrillumonopolyInc顺便说一句，不确定这是一个原因，但您的站点也会抛出错误（在控制台中）未捕获错误：引导下拉列表需要Popper.js(https://popper.js.org)
这也不起作用。我更正了它。仍然没有不同的结果这也不起作用。我更正了它。仍然没有不同的结果请求的url如果错误：p.您正在请求https://www.trillumonopoly.com/testing/pages/pages/artist.php.php
（两页/页）。更改为$（'#main'）。加载（第页）
并且可能会起作用：d这也不起作用。我更正了它。仍然没有不同的结果这也不起作用。我更正了它。仍然没有不同的结果请求的url如果错误：p。您正在请求https://www.trillumonopoly.com/testing/pages/pages/artist.php.php
（两页/页）。更改为$（“#main”）。加载（page）；
可能会起作用：d更正此项后，它仍然会给我相同的结果更正此项后，它仍然会给我相同的结果此项工作还必须将pages/out和.php去掉，并且只包括页面名称，因为它指定了从何处加载（目录）而JS…thx中的扩展这项工作也必须去掉pages/out和.php，只包括页面名称，因为它指定了从何处加载（目录）以及JS…thx中的扩展