Php 使用jquery ajax的load（）无法显示内容_Php_Jquery_Html_Ajax

Php 使用jquery ajax的load（）无法显示内容

php jquery html ajax

Php 使用jquery ajax的load（）无法显示内容,php,jquery,html,ajax,Php,Jquery,Html,Ajax,我有以下html/php代码。单击任何选项卡链接时，文件内容不会加载到特定的标记中 $(document).ready(function() { var hideid = "#laptop"; var showid = "#desktop"; $(hideid).hide(); $('a[href="' + showid + '"]').addClass("active"); $('a[href="#laptop').click(functi

我有以下html/php代码。单击任何选项卡链接时，文件内容不会加载到特定的

标记中

$(document).ready(function() {    
    var hideid = "#laptop";
    var showid = "#desktop";   
    $(hideid).hide();
    $('a[href="' + showid + '"]').addClass("active");
    $('a[href="#laptop').click(function() {
        $(this).addClass('active');
        $('#laptop').show('slow');
        $('#desktop').hide('slow');
        $('a[href="#desktop"]').removeClass("active");
        $("#laptop").load("laptop.html");
    });

    $('a[href="#desktop').click(function() {
        $("#desktop").load("/test.html");
        $(this).addClass('active');
        $('#desktop').show('slow');
        $('#laptop').hide('slow');
        $('a[href="#laptop"]').removeClass("active");
        $("#desktop").load("desktop.html");
    });
});

PHP代码：

<!DOCTYPE html>
<html>
<head>
<style type="text/css">

  ul.tabs { list-style-type: none; margin: 30px 0 0 0; padding: 0 0 0.3em 0; }
  ul.tabs li { display: inline; }
  ul.tabs li a { color: #42454a; background-color: #dedbde; border: 1px solid #c9c3ba; border-bottom: none; padding: 0.4em 2.5em 0.3em 2.5em; border-radius : 5px 5px 0 0; }
  ul.tabs li a:hover { background-color: #f1f0ee; }
  ul.tabs li a.selected { color: #000; background-color: #f1f0ee; font-weight: bold; padding: 0.7em 0.3em 0.38em 0.3em; }
  div.tabContent {border: 1px solid #c9c3ba; border-top : none; padding: 0.5em; background-color: #f1f0ee; border-radius: 0 0 5px 5px}
  div.tabContent.hide { display: none; }

  .tabs a {
            padding:5px 10px;

            background:#D8D8D8;
            color:#fff;
            text-decoration:none;
        }

        .tabs a.active {
            background:#f1f0ee ;
            color:black ;
            font-weight:bold;
        }
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript" src="script.js"></script>

</head>
 <body>
  <ul class='tabs'>
  <li><a href="#desktop" >Desktop</a></li>
  <li><a href="#laptop">Laptop</a></li>
  </ul>

<div class="tabContent" id="desktop">
 </div>
<div class="tabContent" id="laptop">
</div>
</body>
</html>

代码中有什么错误

$('a[href="#desktop').click(function () {

引号是错误的

引号是错误的。

看起来问题出在这一行

$("#desktop").load("/test.html");

如果test.html位于同一目录中，请尝试删除/

看起来问题出在这一行

$("#desktop").load("/test.html");

如果test.html位于同一目录中，请尝试删除/

网络选项卡中显示的内容？有控制台错误吗？test.html是否存在？该路径是否有效？@JonathanCrowe test.html与给定的php/html代码位于同一目录中。并且没有控制台错误。您应该能够通过最喜爱的调试器的“网络”选项卡查看网络流量。你对test.html的调用有什么反应？@JonathanCrowe我还是个乞丐。所以，我不知道如何使用这些调试器。我强烈建议您检查一下。这会让你的生活更轻松：你的网络标签上显示了什么？有控制台错误吗？test.html是否存在？该路径是否有效？@JonathanCrowe test.html与给定的php/html代码位于同一目录中。并且没有控制台错误。您应该能够通过最喜爱的调试器的“网络”选项卡查看网络流量。你对test.html的调用有什么反应？@JonathanCrowe我还是个乞丐。所以，我不知道如何使用这些调试器。我强烈建议您检查一下。这会让你的生活变得更轻松：好的发现——也缺少了结尾的方括号。这一行应该是$（'a[href=“#desktop”]）相同：$（'a[href=“#laptop”）应该是$（a[href=“#laptop”]）很好找到-也缺少结束方括号。这一行应该是$（'a[href=“#desktop”]）相同：$（'a[href=“#laptop”）应该是$（a[href=“#laptop”）