Функция JQuery/AJAX не работает

Question

Я уже задал несколько вопросов об ajax, но я до сих пор не понимаю.

Я взял сценарий, который я нашел в Интернете, и внес некоторые изменения, но это не сработало!

HTML:

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

ORIGINAL SCRIPT:

<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:

<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> 

Что плохого ж с моим сценарием? Ничего не произошло. Я нажимаю на ссылку <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,