Ajax加载页面而不刷新 [英] Ajax load page without refresh

问题描述

我正在寻找信息，最简单的方法是使用jquery + ajax更新页面内容.我只想更新#container内容，而不要更新整个页面.

I am looking for information what is the simplest way to update page content using jquery + ajax. I would like to update only #container content, but not a full page.

我是ajax的乞gg.

I am begginer in ajax.

谢谢.

我的Jquery代码

  <script>
    $(document).ready(function(){
      //page
      $('.row').load('services.html');

      $('.nav_link').click(function(){
        var page = $(this).attr('href');
        $('.row').load(page);
        return false;
      });
    });
  </script>

HTML:

<div class="row">
          <nav role="navigation" class="nav">
            <a class="nav_link" href="services"><div class="nav_line"></div>PASLAUGOS</a> <a class="nav_link" href="contacts.html"><div class="nav_line"></div>KONTAKTAI</a>
          </nav>
        </div>

services.html:

services.html:

<div class="row">
    <nav role="navigation" class="nav">
        <a class="nav_link" href="services.html">
            <div class="nav_line"></div>
            PASLAUGOS
        </a> 
        <a class="nav_link" href="contacts.html">
            <div class="nav_line"></div>
            KONTAKTAI
        </a>
    </nav>
    <div class="result">
      gsdgdsgsdgdsgds gds gdsg dsg sd gds g sdgsd gdsg sd gsd
    </div>
</div>

推荐答案

尝试

$('.row').on("click",".nav_link",function(e){ 
  e.preventDefault(); // cancel click
  var page = $(this).attr('href');   
  $('.row').load(page);
});

由于.on会将点击分配给新链接

Since .on will assign the click to the new links

这篇关于Ajax加载页面而不刷新的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！