jquery/AJAX功能不起作用

Question

我已经问了一些关于ajax的问题​​，但我仍然没有得到它。

我拿了一个脚本，我在互联网上找到并做了一些修改，但它没有奏效！

HTML：

<a data-toggle="team" id="times">TEAM</a> 

原创剧本：

<script> 
// THIS IS WHERE THE MAGIC HAPPENS 
    $(function() { 
     $('nav a').click(function(e) { 
      $("#loading").show(); 
      href = $(this).attr("href"); 

      loadContent(href); 

      // HISTORY.PUSHSTATE 
      history.pushState('', 'New URL: '+href, href); 
      e.preventDefault(); 


     }); 

     // THIS EVENT MAKES SURE THAT THE BACK/FORWARD BUTTONS WORK AS WELL 
     window.onpopstate = function(event) { 
      $("#loading").show(); 
      console.log("pathname: "+location.pathname); 
      loadContent(location.pathname); 
     }; 

    }); 

    function loadContent(url){ 
     // USES JQUERY TO LOAD THE CONTENT 
     $.getJSON("content.php", {cid: url, format: 'json'}, function(json) { 
       // THIS LOOP PUTS ALL THE CONTENT INTO THE RIGHT PLACES 
       $.each(json, function(key, value){ 
        $(key).html(value); 
       }); 
       $("#loading").hide(); 
      }); 

     // THESE TWO LINES JUST MAKE SURE THAT THE NAV BAR REFLECTS THE CURRENT URL 
     $('li').removeClass('current'); 
     $('a[href="'+url+'"]').parent().addClass('current'); 

    } 

</script> 

修改后的脚本：

<script> 

// THIS IS WHERE THE MAGIC HAPPENS 
$(function() { 
    $('#times').click(function(e) { 
     $("#loading").show(); 
     var href = $(this).attr("data-toggle"); 

     loadContent(href); 

     // HISTORY.PUSHSTATE 
     history.pushState('', 'New URL: '+href, href); 
     e.preventDefault(); 


    }); 

    // THIS EVENT MAKES SURE THAT THE BACK/FORWARD BUTTONS WORK AS WELL 
    window.onpopstate = function(event) { 
     $("#loading").show(); 
     console.log("pathname: "+location.pathname); 
     loadContent(location.pathname); 
    }; 

}); 

function loadContent(url){ 
    $.ajax({ 
     url: 'ajaxcontdent/ajax'+url, 
     type: 'GET', 
     error: function(){ 
      // always good to have an error handler with AJAX 
     }, 
     success: function(data){ 
      $('#content').html(data); 
     } 

     // THESE TWO LINES JUST MAKE SURE THAT THE NAV BAR REFLECTS THE CURRENT URL 
     $('li').removeClass('current'); 
     $('a[href="'+url+'"]').parent().addClass('current'); 

    }; 

</script> 

什么是错的w ^我的脚本？什么都没发生。我点击我的<a>链接，没有任何东西。我已经尝试将文件位置放在href属性上，但e.preventDefault();不起作用，我的网站就像没有AJAX一样运行。

在原始代码中，作者使用了一些content.php文件。但我不知道JSON，所以我不知道他在那个文件中放了什么。

控制台中没有错误。

我ajaxcontent/ajaxteam.php文件内容：

<p style="color:#fafafa;">Team</p> 

这确实只是一条线。只是一个测试。

Answer 1

我认为这可能是一个原因语法错误，我已经重新生成了你的一个函数，所以请使用下面的代码。

function loadContent(url){ 
     $.ajax({ 
      url: 'ajaxcontdent/ajax'+url, 
      type: 'GET', 
      error: function(){ 
       // always good to have an error handler with AJAX 
      }, 
      success: function(data){ 
       $('#content').html(data); 
      } 
     }); 
    }; 

然后在上面的函数的成功块中使用你的操作，无论你想要什么。

我希望薄会帮助你。

Thansk

Answer 2

在你的代码，如果我没看错的

url: 'ajaxcontdent/ajax'+url,

这是主要的罪魁祸首。

试试这个：

url: 'ajaxcontent/ajax'+url,