.html（）方法不改变div内容

你好家伙需要一些帮助。我有这样的ajax代码。.html（）方法不改变div内容

$(document).ready(function() { 
    $(".ajaxLoadPage").click(function(){ 
     var page=$(this).attr('id'); 
     alert(page); 
     $.ajax({ 
      type:'GET', 
      url:"/SMS/jsp/"+page+".do", 
      async:false, 
      dataType:"html", 
      cache:false, 
      success:function(result){ 
       $('#main-content').html(result); 
      } 
     }); 
    }); 
}),

它成功地从服务器返回的“结果”，但是当我试图用结果覆盖DIV #main-content像

$('#main-content').html(result);

为第二几个分数div#main-content是获得替换/覆盖'结果'，但在此之后div#main-content会自动加载前一个/旧内容？

请帮我我正是为什么这个错误发生。

来源

2015-11-06 SaaD Ahmed

检查的ID是重复的。如果没有，请添加完整的HTML – Tushar

听起来像您的网页以某种方式重新加载...您不是在提交表单吗？结果是什么样的？而FYI，'async：false'是不行的 –

'console.log（result）'说什么？ – Reeno

这个用例有专门的jQuery函数。它被称为（docs）。

$(function() { 
    $(".ajaxLoadPage").click(function() { 
     $('#main-content').load("/SMS/jsp/" + this.id + ".do"); 
    }); 
});

即使你不想使用此功能，您的方法仍然复杂得多，它必须是：

$(function() { 
    $(".ajaxLoadPage").click(function() { 
     $.get("/SMS/jsp/" + this.id + ".do").done(function (result) { 
      $('#main-content').html(result); 
     }); 
    }); 
});

注：

没有一个单一原因使用同步Ajax请求。永远。
从服务器发送适当的HTTP缓存头，并且不需要影响客户端的缓存行为。这总是可取的。
当$.get()完成这项工作时，没有必要使用$.ajax()。
$(this).attr('id')是一个非常详细的方式说this.id。

来源

2015-11-06 13:47:14 Tomalak

Ya ，但是如何解决OP的问题？'event.preventDefault（）;'听起来像缺少的东西 –

@ A.Wolff它可能不会，因为OP的问题似乎并不在他显示的示例代码中。如果'.ajaxLoadPage'是一个''，那么是的，或者像'href =“＃”'）。 – Tomalak

@ Tomalak，你好，非常非常感谢，你的建议对我来说非常合适。谢谢。 –

你曾经说过：

async:false

这意味着JavaScript的将阻止一切被在页面上发生的事情。

对于第二个div的几分之一＃main-content被替换/用'result'覆盖，但在此之后，div＃main-content会自动加载前一个/旧内容？

这意味着你通过自然加载新页面来触发JavaScript。可能点击链接或提交表单。

如果您没有async:false，它会刚刚重新加载页面而不等待JS运行。

要正确地解决这个问题：

写quality HTML and enhance it with JavaScript。

设置触发JS的链接，所以它做的是正确的事when JS fails。（注意：你应该得到这个返回一个完整的HTML文档）。

<a href="/SMS/jsp/something.do">...</a>

然后你可以在JavaScript中使用href。

url: $(this).attr('href'),

确保您阻止链接的默认行为时JS可用：

$(".ajaxLoadPage").click(function(event){ 
    event.preventDefault();

你需要适应$('#main-content').html(result);所以它过滤掉你没有更新的内容（如主导航）。

并且不要阻止浏览器在等待来自服务器的数据时与其他内容相关（删除async:false,）。

来源

2015-11-06 13:52:32 Quentin

休耕评论已经帮我解决我的问题
(If .ajaxLoadPage is an <a>, then yes. That, or something like href="#") 鉴于@Tomalak

来源

2015-11-30 17:25:11

.html（）方法不改变div内容

回答

相关问题